2011-06-16 12 views
8

Acabo de descubrir que un elemento flotante también lo convertirá en un bloque, por lo que se especifica una propiedad flotante y pantalla: el bloque es redundante.Reglas CSS redundantes, es decir, flotante y pantalla: bloque

(¿Qué pasaría si se trató de especificar display: inline y flotador: la izquierda)

¿Hay otros ejemplos de combinaciones redundantes a tener en cuenta? bloque & ancho? etc,

¿Existe alguna herramienta que pueda verificar tales cosas?

+0

No sé lo que quiere decir "solicitud redundante de 'otros ejemplos' y 'una herramienta para verificar tales cosas'" – hooleyhoop

+0

@thirtydot: Creo que leyó mal la pregunta> dado "flotar: izquierda; mostrar :bloquear;" la "pantalla: bloque" es redundante, ¿no? Me preguntaba qué otras combinaciones podrían ser redundantes. "display: roflcopter; float: top" es tu mejor ejemplo? – hooleyhoop

+0

Voy a escribir una mejor respuesta para reemplazar los comentarios que voy a eliminar. – thirtydot

Respuesta

16

Me acabo de enterar que un elemento flotante también hará que sea un bloque, por lo tanto, especificando una propiedad float y display:block es redundante.

Sí, display: block es redundante si ha especificado float: left (o right).

(¿Qué pasaría si se trató de especificar display: inline y el flotador: izquierda )

display: inline no hará ninguna diferencia, porque el establecimiento float: left fuerzas display: block "no importa qué":

http://www.w3.org/TR/CSS2/visuren.html#dis-pos-flo

De lo contrario, si 'float 'tiene un valor que no sea' ninguno ', la casilla está flotante y la' pantalla 'se configura de acuerdo con la tabla que se encuentra debajo.

Resumir dicha tabla: float = display: block.

Sin embargo, el ejemplo específico de float: left; display: inline es útil en una manera - it fixes an IE6 bug.

¿Hay otros ejemplos de combinaciones redundantes a tener en cuenta para ? bloque & ancho? etc,

Algunos ejemplos:

  • Si establece position: absolute, a continuación, se ve obligado float: none.
  • El top, right, bottom, left propiedades no tendrá ningún efecto a menos que position se ha establecido en un valor distinto del predeterminado de static.

¿Hay una herramienta que puede comprobar si hay tales cosas?

Yo no piensa so. No es algo que siempre se necesita, así que no puedo ver por qué alguien habría escrito una herramienta de este tipo.

+1

Gracias por los ejemplos, exactamente lo que estaba buscando. Solo como un ejemplo, un vistazo rápido a través del CSS de Stack Overflow muestra muchas clases que especifican float: left y display: block - no cree que sea una buena práctica eliminar cosas innecesarias de archivos css, y que una herramienta para esto podría ser ¿servicial? – hooleyhoop

+0

No es realmente un * problema * per se, porque los archivos CSS a menudo tienen cientos, sino miles de líneas, y eliminar una sola propiedad no hará ninguna diferencia notable. Pero sí, estoy de acuerdo en que es una buena práctica dejarlo fuera porque es innecesario. Después de todo, "la perfección se logra cuando no queda nada para llevar". – thirtydot

1

De mi experiencia IE6 tiene problemas con la flotación: izquierda. Para compatibilidad, despliegue: en línea se agrega declaraciones flotantes.

Cuestiones relacionadas