Domanda

Versione corta:

Quando due liste sono adiacenti l'uno all'altro, c'è un modo con i CSS (o con altri mezzi) per evitare una nuova linea di essere aggiunto tra i due elenchi?


Versione lunga (con codice):

Ho generato macchina HTML che non è intelligente gestisce liste nidificate che gli elementi <ol> mix e <ul>. (Se avete indovinato che si tratta di Oracle UCM dinamico Converter, si vince il premio.)

In particolare, quando i nidi documento di origine liste ordinate e non, l'HTML generato chiude tutti i tag the-lista ordinata di nuovo al livello superiore, e comincia una nuova lista non ordinata, utilizzando più tag non ordinata-list per ottenere il livello desiderato di indentazione.

Dato che questi sono elementi di blocco, i browser rendono questo con un ritorno a capo indesiderato tra le liste. Se ho avuto un controllo diretto sul codice HTML, questo sarebbe facile, ma ahimè. Credo che CSS è fattibile, ma il mio parente ditale di conoscenza CSS mi sta venendo a mancare. (Uso Naive di style="display: inline;" con gli elementi <ul> non ha funzionato per me.)

Astratto, sto ottenendo:

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

Si spera, c'è un modo per rendere la versione resa in questo modo:

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

Spero che questo è un po 'facile di CSS.

Grazie!

È stato utile?

Soluzione

Se il problema unico visibile è la riga vuota tra le liste, come su semplicemente:

ol, ul {
    margin-top: 0;
    margin-bottom: 0;
}
Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top