viƱetas una que propiedades personalizadas para ordenadas listas lista las hacer estilos elegantes ejemplos con como aplican css list yui-grids

css - una - El estilo de lista UL no se aplica



propiedades css que se aplican a las listas ordenadas y no ordenadas (12)

Tuve este problema y resultó que no tenía ningún relleno en el ul, que impedía que los discos se vieran.

El margen se mete con esto también

Tengo una hoja de estilo que, por el motivo que sea, no aplicará el tipo de estilo de lista a un elemento UL. Estoy usando Grid CSS de YUI con su archivo reset-fonts-grid.css, que sé que quita eso como parte del restablecimiento de CSS.

Después de llamar a YUI, llamo a la hoja de estilo para el sitio web y allí tengo un bloque para UL:

ul {list-style-type: disc;}

También intenté configurarlo a través del estilo de lista, pero obtuve el mismo resultado. Sé que el bloque de CSS anterior se está leyendo, como si agregara cosas como el relleno o los márgenes que se aplican. El estilo de estilo no se muestra en Firefox o IE.

El único otro CSS que he aplicado a UL está en un div #nav pero ese CSS no toca el tipo de estilo de lista, usa el restablecimiento que YUI proporcionó, y YUI y la hoja de estilos del sitio son los únicos dos CSS hojas que se llaman.

También tengo FCKEditor en el lado de administrador del sitio y ese editor muestra los estilos de viñetas, así que sé que tiene que ser algo con el CSS que no está siendo filtrado por FCKEditor.


Resulta que el restablecimiento de CSS de YUI elimina el estilo de lista de ''ul li'' en lugar de solo ''ul'', por lo que configurarlo nunca funcionó.


Si no me equivoco, debería aplicar esta regla al li, no a la ul.

ul li {list-style-type: disc;}


Todo lo que puedo pensar es que algo está superando esto después.

Está incluyendo los estilos de reinicio primero , ¿verdad?


  • ¿Has intentado seguir la regla con! Importante?
  • ¿Qué hoja de estilos muestra FireBug con el último control sobre el elemento?
  • ¿Esto es vivir en algún lugar para ser visto por otros?

Actualizar

Estoy bastante seguro de que proporcionar ejemplos de código lo ayudará a recibir una solución más rápido. Si puede cargar un ejemplo de este problema en alguna parte, o proporcionar el marcado para que podamos probarlo en nuestros locales, tendrá una mejor oportunidad de obtener información valiosa.

El problema con las preguntas es que llevan a otros a creer que la persona que hace la pregunta tiene el conocimiento suficiente para hacer la pregunta. En la programación que no siempre es el caso. Puede haber sido algo que te perdiste, o que accidentalmente se rompió. Sin que otros tengan ojos en tu código, deben suponer que no te perdiste de nada, y no pasaron por alto nada.


y también puede dar un margen izquierdo si el reset.css que está utilizando hace que todo el margen sea nulo: eso significa:

li { list-style: disc outside none; display: list-item; margin-left: 1em; }

¡Suponiendo que aplique este CSS después del reinicio, debería funcionar!

Matthieu Ricaud


Asegúrese de que el ''li'' no tenga overflow: hidden aplicado.


Tuve este problema y resultó que no tenía ningún relleno en el ul, que impedía que los discos se vieran.


En IE, utilizo una clase "normal_ol" para diseñar una lista e hice algunas modificaciones a continuación:

código anterior: ol.normal_ol {float: left; relleno: 0 0 0 25px; margen: 0; ancho: 500px;} ol.normal_ol li {font: normal 13px / 20px Arial; color: # 4D4E53; flotador izquierdo; ancho: 100%;}

código modificado: ol.normal_ol {float: left; relleno: 0 0 0 25px; margin: 0;} ol.normal_ol li {font: normal 13px / 20px Arial; color: # 4D4E53; }


Debe incluir lo siguiente en su css:

li { display: list-item; }

Esto hace que Firefox muestre el disco.


Este problema fue causado por el atributo de display li se configuró para block en una clase principal. Reemplazar con list-item resolvió el problema.


Mi reset.css fue margin: 0, padding: 0 . Después de varias horas de búsqueda y resolución de problemas, funcionó:

li { list-style: disc outside none; margin-left: 1em; } ul { margin: 1em; }