|
|
|
| Помогите пожалуйста с версткой уже все перепробовал =(
Есть такой код :
<style>
div.body {position:relative; width:20%; float:left; }
div.right {position:relative; margin-left:23%; width:29%;background-position:left; background-repeat:repeat-y; padding:10px 0 10px 25px;}
</style>
<div class=body>
<img src="img/logo1.png" />
</div>
<div class="right">
<img src="img/top-banner.jpg" style="position:relative; float:left;">
</div>
|
когда окно браузера открыть на всю ширину то нормально, а если сужается(особенно при разрешении 1024X768) правая картинка заезжает на левую. | |
|
|
|
|
|
|
|
для: korneplodus
(13.03.2009 в 16:56)
| | Во-первых, ЗАЧЕМ используете <DIV>?
Вы не в курсе, что ЛЮБОЕ правило стиля, используемое к <DIV>, можно использовать и к ЛЮБОМУ другому тегу - в данном случае к <IMG>?
Колбасу (<IMG>) просто так вы кушать не можете, да? Вам обязательно надо завернуть её в бумажку (<DIV>)? :-)
Во-вторых, именно использование тега <DIV> и приводит вас к данной проблеме.
В данном случае НЕОБХОДИМО использовать ТАБЛИЦУ - и это ЕДИНСТВЕННОЕ ВОЗМОЖНОЕ кроссбраузерное решение (ибо тег <NOBR> и правило стиля wrap поддерживают далеко не все браузеры).
Решение: прописываете таблицу (БЕЗ указания её ширины), в которой делаете одну строку и две ячейки, в кажую из которых и "впихиваете" свои картинки. ТОЛЬКО тогда (и никогда иначе!!!) обе картинки будут у вас следовать одна за другой в одну линию и не будут ни заезжать друг на друга (и - как вариант - вторая картинка не будет переноситься ниже первой). | |
|
|
|
|
|
|
|
для: PAT
(13.03.2009 в 17:25)
| | Спасибо =) | |
|
|
|