HTML / CSS: problema de superposición de li y ul

Estoy usando un tema que parece un poco roto.
Estoy tratando de enumerar categorías con subs y dentro de ellas hay más subs.

es decir: la papa y el apio son de nivel superior, con sus subs y subsubs.

de papa

marrón

lavado

apio

green

Corto

El problema que tengo es que los niveles superiores (papa y apio) se muestran uno debajo del otro, en lugar de apio que se muestra después de la última sub / sub-sub-sub-sub de patatas como se muestra arriba. Esto conduce a todos los subtítulos de cada texto superpuesto.

es decir:

de papa
apio marrón

lavado verde

Corto

CO

#sidebar ul li {
    height: 35px;
    line-height: 35px;
    border-bottom: 1px solid #f0f0f0;
}
    ul.ecart_categories { /* category list container */ }
    ul.ecart_categories li { /* category listing containers */ }
    ul.ecart_categories li a { /* category link default styles */ }
    ul.ecart_categories li a:hover { /* category link hover styles */ }
    ul.ecart_categories li span { /* categpry product count styles */ }
    ul.ecart_categories li.current { /* currently viewed category container */ }
    ul.ecart_categories li.current a { /* currently viewed category link style */ }
    ul.ecart_categories li.current a:hover { /* currently viewed category link hover style */ }
    ul.ecart_categories li ul.children { padding-left: 10px;/* sub-category list container */ }
    ul.ecart_categories li ul.children li { padding-left: 10px;/* sub-category listing container */ }
    ul.ecart_categories li ul.active { /* active sub-category container */ }

SALIDA

<div class="one_fourth" id="sidebar">
    <li id="ecartcategorieswidget-3" class="widget-1 widget-first widget sbg_widget Shop widget_ecartcategorieswidget">
    <h2 class="widgettitle sbg_title">Categories</h2>
    <ul class="ecart_categories">
        <li><a href="http://www.myWPurl.com/?page_id=25&amp;ecart_category=30">Potato</a>
            <ul class="children">
                <li><a href="http://www.myWPurl.com/?page_id=25&amp;ecart_category=36">Brown</a>
                    <ul class="children">
                        <li><a href="http://www.myWPurl.com/?page_id=25&amp;ecart_category=40">Washed</a></li>
                    </ul>
                </li>
            </ul>
        </li>
        <li><a href="http://www.myWPurl.com/?page_id=25&amp;ecart_category=1">Celery</a>
            <ul class="children">
                <li><a href="http://www.myWPurl.com/?page_id=25&amp;ecart_category=2">Green</a>
                    <ul class="children">
                        <li><a href="http://www.myWPurl.com/page_id=25&amp;ecart_category=12">Long</a></li>
                    </ul>
                </li>
            </ul>
        </li>
    </ul>
    </li>
</div>

preguntado el 28 de agosto de 11 a las 02:08

1 Respuestas

Bienvenido a SO @ dazza49r.

Debe haber algo más que interfiera, porque el código que proporcionó funciona:

http://jsfiddle.net/jasongennaro/CzcrM/

¿Puede proporcionar más CSS que omitió?

EDITAR

Según el nuevo código ... el problema es con el height

#sidebar ul li {
    height: 35px;  //REMOVE THIS
    line-height: 35px;
    border-bottom: 1px solid #f0f0f0;
}

Funciona bien ahora ... http://jsfiddle.net/jasongennaro/CzcrM/1/

Respondido 28 ago 11, 07:08

¡Gracias! ¿Puedo enviarte el enlace de forma privada? No puedo encontrar la causa :( - dazza49r

Jason Gennaro: Pregunta actualizada ... ¿es esa barra lateral, pero no sabes cómo solucionarlo? - dazza49r

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.