Горизонтальное подменю

[rondew]

привет.

подскажите, как реализовать с помощью css такое меню:

первый уровень в строку. второй уровень располагается в строку той же ширины, что и первый, то есть не зависит от li-родителя. в общем, надо сделать так, чтобы какой бы пункт я не выбрал, дочерний ul начинался от левого края страницы.

я пытался меня position, но окончательно запутался. проблема в том, что у меня центрированная страница и координаты задать точно нельзя, они зависят от разрешения монитора.

как это сделать?

Edited September 18, 2011 by rondew

[Int]

Сделать область с контентом relative и задавать позицию относительно неё, а не края экрана.

[rondew]

Сделать область с контентом relative и задавать позицию относительно неё, а не края экрана.

спасибо. попробую. пока сделал криво, с помощью движка wordpress.

может, вы сможете ответить на еще один вопрос? он глупый. как сделать так, чтобы элементы списка, не вмещающиеся в контейнер переносились на следующую строку? бьюсь уже больше часа.

допустим, есть список из 6 элементов. он помещен в контейнер, в который по высоте вмещаются только два пункта. надо в итоге получить 3 столбца по 2 пункта. я дошел уже до псевдокласса :nth-child, но в этом случае float: left работает как-то странно — переносит третий пункт относительно второго, а не обоих. лесенка получается, короче(

[Softlink]

Докрутите этот пример для себя.

[rondew]

Докрутите этот пример для себя.

спасибо. стал было докручивать, но подоспел более интересный вариант. там зависит от ширины контейнера. то есть, если див широкий, а ширина li невелика, то они растянутся по одному пункту. уже можно, но не то.

вот самый интересный вариант:

<style>
    li { float: left; margin: 1em; }
    li:nth-child(2n+1) { clear: both; }
</style>
<ul>
    <li> 1
    <li> 2
    <li> 3
    <li> 4
    <li> 5
    <li> 6
</ul>

стирать обтекание я почему-то не догадался. хотя теперь это кажется очевидным)

[rondew]

впрочем, есть и разочарование — :nth-child не будет работать в ИЕ, кроме девятого. а жаль. отличная шутка.