<ul style="list-style: none; margin: 0 0 0 0; padding-left: 0px;">
<li>Главный Элемент 1</li>
<li>Главный Элемент 2</li>
<li>Главный Элемент 3</li>
<div style="position: relative; top:0px; left:200px; display:block;">
<ul style="list-style: none; margin: 0 0 0 0; padding-left: 0px;">
<li>Элемент 1</li>
<li>Элемент 2</li>
<li>Элемент 3</li>
<li>Элемент 4</li>
</ul>
</div>
<li>Главный Элемент 4</li>
<li>Главный Элемент 5</li>
</ul>
Позиционирование списков
Код:
Есть 2 вложенных списка.
В браузере это выглядит так, что Главный Элемент 4 и Главный Элемент 3 раздвигаются - как бы резервируется место под список с обычными элементами, а список с обычными элементами сдвигается вправо на 200px.
Нужно спозиционировать список с обычными элементами относительно Главного Элемента 3, поэтому я применяю свойство relative. Но как сделать так, чтобы не было пустого пространства между Главный Элемент 4 и Главный Элемент 3?
Можно применить свойство absolute, но тогда мой список с обычными элементами будет позиционироваться относительно верхнего левого угла окна браузера, а не Главного Элемента 3.
Как это можно решить?
Очень нежелательно, чтобы где-то резервировалось место под список с обычными элементами. Желательно, чтоб он был летающим на слое.