Frage

Kurzversion:

Wenn zwei Listen benachbart zueinander sind, ist es eine Möglichkeit, mit CSS (oder durch andere Mittel), um eine neue Zeile zu verhindern, dass zwischen den beiden Listen hinzugefügt werden?


Lange Version (mit Code):

Ich habe maschinengeneriertes HTML, die nicht intelligent ist, verschachtelte Listen, dass Mix <ol> und <ul> Elemente Handhabung. (Wenn Sie erraten, dass dies Oracle UCM Dynamic Converter, gewinnen Sie den Preis.)

Insbesondere dann, wenn die Quelldokument Nester geordnete und ungeordnete Listen, die erzeugte HTML schließt alle die geordnete Liste-Tags auf die oberste Ebene zurück und beginnt eine neue ungeordnete Liste, mehrere ungeordnete-Liste-Tags mit dem gewünschten Niveau erhalten von Einbuchtung.

Da diese Blockelemente sind, Browser zeigt dies mit einem unerwünschten Newline zwischen den Listen. Wenn ich die direkte Kontrolle über den HTML hatte, würde dies einfach sein, aber leider. Ich glaube, dass CSS ist machbar, aber meine relativ Fingerhut CSS Wissen versagt mir. (Naive Verwendung von style="display: inline;" mit den <ul> Elemente nicht für mich arbeiten.)

abstrahiert, erhalte ich:

<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>

Hoffentlich gibt es eine Möglichkeit, es die gerenderte Version so zu machen:

<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>

Ich hoffe, dies ist ein einfach bisschen CSS.

Danke!

War es hilfreich?

Lösung

Wenn die einzige sichtbare Problem ist die Leerzeile zwischen den Listen, wie etwa einfach:

ol, ul {
    margin-top: 0;
    margin-bottom: 0;
}
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top