#html #css
#HTML #css
Вопрос:
Эти ul находятся внутри контейнера фиксированного размера..
<ul>
<li><a href="#">ΑAOS</a></li>
<li><a href="#">ACC</a></li>
<li><a href="#">ACCP</a></li>
<li><a href="#">AJP</a></li>
<li><a href="#">Anejo</a></li>
</ul>
<ul>
<li><a href="#">ASCO</a></li>
<li><a href="#">British Medical Journal</a></li>
<li><a href="#">Current Medical Literature</a></li>
<li><a href="#">Clinical Publishing</a></li>
<li><a href="#"> EC-Europ</a></li>
</ul>
and another one
Проблема в том, что с IE6 они занимают всю ширину контейнера… Установка li в float left не занимает всю ширину, но я не хочу, чтобы они шли слева друг от друга.
#journals-list {background: url(img/journals-background.png) ;background-repeat: no-repeat;height: 300px;width: 495px;}
#journals-list ul {float: left;margin-left: 20px;margin-right: 20px;display: inline;zoom:1; margin-top: 55px;}
#journals-list ul li{display: block; height: 39px; line-height: 39px;border-bottom-style: solid;border-bottom-color: #cc784e;border-bottom-width: 1px;padding-right: 15px;padding-left: 10px;}
#journals-list ul li{background-image: url(img/journal-bullet.png);background-repeat: no-repeat;background-position: left center;}
#journals-list ul li:last-child{border-bottom-style:none;border-bottom-width:0}
#journals-list ul li a{text-decoration: none;color: #FFFFFF;}
Я использую СБРОС CSS по Майерсу..
Комментарии:
1. Не могли бы вы добавить ссылку на реальный сайт или создать тестовый пример JS Bin ?
2. В Mosaic это тоже не работает. :S
3. jsbin.com/etuve4/5 Вот пример…. Я вынужден поддерживать ie6 и изменить png на 8bit …
Ответ №1:
Похоже, это один из случаев, когда вы не хотите, чтобы hasLayout был установлен. Проблема в том, что настройка высоты в #journals-list ul li
приводит к установке hasLayout для этих элементов. Удалите его, и проблема исчезнет. Добавьте, скажем, zoom: 1, и проблема вернется.
В зависимости от фактических данных, которые вы хотите представить, вам может сойти с рук просто удаление настройки стиля высоты и использование настройки высоты строки для обеспечения правильного вертикального интервала.
Комментарии:
1. спасибо, большое вам спасибо… Вы сэкономили мне много часов 🙂 Проблемой была высота. Теперь работает отлично..
2. есть недостаток: ( Li добавляет отступ слева, когда у него нет макета.