Master-X
Форум | Новости | Статьи
Главная » Форум » Дизайн » 
Тема: Помогите с версткой
цитата
06/07/10 в 12:22
 WorldTraffic
делаю так
<div id="block">
<div class="block">
<ul>
<li>text</li>
<li>text</li>
</ul>
</div>
</div>

в css
#block { clear: both; margin:auto; width:1000px; background-color:#FFFADD;}
.block {text-align:left;}
.block ul { margin: 15px 0px 0px -39px; }
.block li {float:left; width:237px; margin-top:1px; margin-left:1px; background-color:#FFFDF1; height:22px; list-style-image: url(../images/images.gif); list-style-position:inside;}

проблема в том, что пока я не пропишу в #block высоту фон не работает, точнее работает но не на весь блок, а только дето пикселей 10(может 15 визуально определял) в верху

можно как-то сделать, что бы высоту не прописывать (а то надо что бы автоматом увеличивалась высота) и что бы фон был до конца блока?

спасибо
цитата
06/07/10 в 13:27
 ePayService
Попробуй перед закрытием блока вставить br/div/и т.д со следующими свойствами на выбор:

/* `Clear Floated Elements
----------------------------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */

.clear {
   clear: both;
   display: block;
   overflow: hidden;
   visibility: hidden;
   width: 0;
   height: 0;
}

/* http://perishablepress.com/press/2008/02/05/lessons-learned-concern…x-css-hack */

.clearfix:after {
   clear: both;
   content: ' ';
   display: block;
   font-size: 0;
   line-height: 0;
   visibility: hidden;
   width: 0;
   height: 0;
}

.clearfix {
   display: inline-block;
}

* html .clearfix {
   height: 1%;
}

.clearfix {
   display: block;
}


И прописать фоновой пикче repeat-y.
цитата
06/07/10 в 15:57
 FXIX
world-gay-sex писал:

проблема в том, что пока я не пропишу в #block высоту фон не работает, точнее работает но не на весь блок, а только дето пикселей 10(может 15 визуально определял) в верху
можно как-то сделать, что бы высоту не прописывать (а то надо что бы автоматом увеличивалась высота) и что бы фон был до конца блока?
спасибо

а кто тебе сказал что у тебя #block вообще имеет высоту? У тебя <li> зафлоачены, вышестоящий ul схлопнулся в ноль. Все вышестоящие дивы тоже занулились. то что ты видишь полоску - это верхний margin у ul. Сам он высоты не имеет, но отступ отбивает.
лекарство:
ul {overflow:hidden;}


Эта страница в полной версии