С нами с 13.11.06
Сообщения: 777
Рейтинг: 418
|
 Добавлено: 18/04/08 в 12:06 |
| Код: |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--
body {
background-color: #9966FF;
}
#main {
margin: 0 auto;
width: 760px;
border: #000000 double 5px;
}
#picContent {
margin: 0 auto;
width: 740px;
height: 752px;
border: #FFFFFF double 5px;
}
#picContent a img {
padding: 0;
border: #FFFFFF solid 2px;
}
#picContent a:hover img {
border: #FF0000 solid 2px;
}
#picContent a img.rowPics {
margin: 2px;
width: 140px;
height: 160px;
float: left;
}
#picContent a img.leftPics {
margin: 2px;
width: 288px;
height: 200px;
float: left;
}
#picContent a img.rightPic {
margin: 2px;
width: 436px;
height: 408px;
float: right;
}
-->
</style>
</head>
<body>
<div id="main">
<div id="picContent">
<a href="#"><img src="#" class="rowPics" /></a>
<a href="#"><img src="#" class="rowPics" /></a>
<a href="#"><img src="#" class="rowPics" /></a>
<a href="#"><img src="#" class="rowPics" /></a>
<a href="#"><img src="#" class="rowPics" /></a>
<a href="#"><img src="#" class="rightPic" /></a>
<a href="#"><img src="#" class="leftPics" /></a>
<a href="#"><img src="#" class="leftPics" /></a>
<a href="#"><img src="#" class="rowPics" /></a>
<a href="#"><img src="#" class="rowPics" /></a>
<a href="#"><img src="#" class="rowPics" /></a>
<a href="#"><img src="#" class="rowPics" /></a>
<a href="#"><img src="#" class="rowPics" /></a>
</div>
</div>
</body>
</html>
|
Не обращайте внимание на цвета и тд и тп, пытаюсь просто собрать РОВНО тумбы в блоке. Вопрос такой. В данном варианте нижний ряд разьезжается в Дриме, хотя в браузерах последних версий все ок. Что делать? Чито теоретически не нужны float-ы во всех стилях, кроме rightPic, но почему то если не использовать float, то не выдерживаются расстояния между тумбами. Например если убрать float в стиле leftPics - все вроде собирается нормально, а ИЕ7 тогда не выдерживает расстояния не по горизонтали не по вертикали между левыми большими тумбами... В общем у меня сейчас полные непонятки. Как правильно стили задать/что яделаю не так? Ширину и высоту блока, да и вообще размеры тумб, вымерял до пиксела, так что все должно уместиться чисто теоретически.
|
|
|
|
| |
чоткий дезайнер
С нами с 20.07.06
Сообщения: 1782
Рейтинг: 731
|
| Добавлено: 18/04/08 в 12:25 |
дрим вообще дивную верстку (если она не совсем простая) обычно не правильно показывает, главное что в браузерах все нормально
|
|
|
|
| |
Раздаю инвайты, ищу линк-трейд
С нами с 20.08.04
Сообщения: 16668
Рейтинг: 8593
|
| Добавлено: 18/04/08 в 12:44 |
Да вроде ок все (как в дриме - не знаю, я его и не открывал ни разу)
|
|
|
|
| |
С нами с 12.07.04
Сообщения: 1035
Рейтинг: 678
|
| Добавлено: 18/04/08 в 13:00 |
| borgivan писал: | | В данном варианте нижний ряд разьезжается в Дриме, хотя в браузерах последних версий все ок. |
Забей на закладку Design, юзай закладку Code и проверяй в броузерах. ;)
|
|
|
|
| |
С нами с 13.11.06
Сообщения: 777
Рейтинг: 418
|
| Добавлено: 20/04/08 в 11:29 |
Ясно... А всетаки? Почему когда я тумбы без свойства float делаю, не выдерживаются интервалы заданные! 
|
|
|
|
| |
С нами с 01.04.07
Сообщения: 4378
Рейтинг: 2970
|
| Добавлено: 20/04/08 в 11:59 |
Известный глюк ИЕ.
Вылечить можно вытягиванием кода в одну строку, удалив все пробелы и переносы строк (в блоке picContent) или поигравшись с display:inline
Я когда-то игрался, так и не нашёл решения, вытянул всё в строку.
|
|
|
|
| |
« ... full on ... »
С нами с 17.03.07
Сообщения: 670
Рейтинг: 1686
|
| Добавлено: 20/04/08 в 15:10 |
| Цитата: | | Вылечить можно вытягиванием кода в одну строку, удалив все пробелы и переносы строк (в блоке picContent) |
Точно. А чтобы не делать это вручную, можно для родительского элемента (#picContent) прописать в CSS:
| Код: | | white-space: nowrap; |
|
|
|
|
Power of the lime madness...
|
4
|
|
| |
С нами с 13.11.06
Сообщения: 777
Рейтинг: 418
|
| Добавлено: 20/04/08 в 22:23 |
| Corex писал: | Точно. А чтобы не делать это вручную, можно для родительского элемента (#picContent) прописать в CSS:
| Код: | | white-space: nowrap; |
|
Да что то я добавил, но почему то во всех браузерах эти гребаные картинки разьезжаются если не указывать float, блин... либо лыжи не едут... какие ещё свойства у элементов поменять что бы не было лишних "пробелов" между ними. Забыл может что то?
|
|
|
|
| |
Текстовая реклама в форме ответа
Заголовок и до четырех строчек текста
Длина текста до 350 символов
Купить рекламу в этом месте! |
