Избегать новой строки между соседними списками HTML?

Укороченная версия:

Когда два списка находятся рядом друг с другом, есть ли способ с помощью CSS (или каким-либо другим способом) предотвратить добавление новой строки между двумя списками?


Длинная версия (с кодом):

У меня есть сгенерированный машиной HTML, который не может разумно обрабатывать вложенные списки, которые смешивают элементы <ol> и <ul>. (Если вы догадались, что это Oracle UCM Dynamic Converter, вы выиграли приз.)

В частности, когда исходный документ объединяет упорядоченные и неупорядоченные списки, сгенерированный HTML закрывает все теги упорядоченного списка обратно на верхний уровень и начинает новый неупорядоченный список, используя несколько тегов неупорядоченного списка для получения желаемого уровня отступа.

Поскольку это блочные элементы, браузеры отображают их с нежелательной новой строкой между списками. Если бы у меня был прямой контроль над HTML, это было бы легко, но, увы. Я считаю, что CSS выполним, но мои относительные знания CSS подводят меня. (Наивное использование style="display: inline;" с элементами <ul> у меня не сработало.)

Абстрагируясь, я получаю:

<ol><li>item 1</li> 
    <li>item 2</li> 
    <ol><li>item 1, indent level 2</li> 
        <li>item 2, indent level 2</li> 
</ol></ol>

<ul><ul><ul><li>bullet, indent level3<li> 
            <li>bullet, indent level3<li>
</ul></ul></ul>

Надеюсь, есть способ сделать визуализированную версию следующим образом:

<ol><li>item 1</li> 
    <li>item 2</li> 
    <ol><li>item 1, indent level 2</li> 
        <li>item 2, indent level 2</li> 

<ul><li>bullet, indent level3<li> 
    <li>bullet, indent level3<li>
</ul></ol></ol>

Я надеюсь, что это простой бит CSS.

Спасибо!


person res    schedule 18.10.2010    source источник


Ответы (1)


Если единственной видимой проблемой является пустая строка между списками, как насчет простого:

ol, ul {
    margin-top: 0;
    margin-bottom: 0;
}
person VoteyDisciple    schedule 18.10.2010