display:inline
Los elementos inline no generan una nueva línea en el flujo del texto. Los elementos inline son vistos como elementos “internos” subordinados para los hacia arriba elementos de bloque.
Elementos Inline por defecto:
a, abbr, acronym, applet, b, basefont, bdo, big , br, button, cite, code, dfn, em, font, i, img, input, iframe, kbd, label, map, object, q, samp, script, select, small, span, strong, sub, sup, textarea, tt, var.
display:block
Los elementos de bloque generan una nueva línea (renglón) en el flujo del texto
Elementos de bloque por defecto:
address, blockquote, center, dl, dir, div, fieldset, form, h1-6, hr, isindex, menu, noframes, noscript, ol, p, pre, table, ul.
display:inline-block
En la especificación de CSS2.1 se añadió este valor que permite integrar las ventajas de ambas propiedades. Con este valor podemos crear bloques en la misma línea de flujo, haciendo que diseños como rejillas sean posibles.
Actualmente, solo los navegadores modernos lo interpretan, por lo que nos vemos obligados a usar un hack para que todos los navegadores lo “emulen”.
display:inline-block
En la especificación de CSS2.1 se añadió este valor que permite integrar las ventajas de ambas propiedades. Con este valor podemos crear bloques en la misma línea de flujo, haciendo que diseños como rejillas sean posibles.
Actualmente, solo los navegadores modernos lo interpretan, por lo que nos vemos obligados a usar un hack para que todos los navegadores lo “emulen”.

float
en ellos.
Código
li {
width: 200px;
min-height: 250px;
border: 1px solid #000;
display: -moz-inline-stack; /* FF2*/
display: inline-block;
vertical-align: top; /* BASELINE CORRECCIÓN*/
margin: 5px;
zoom: 1; /* IE7 (hasLayout)*/
*display: inline; /* IE */
_height: 250px; /* IE6 */
}
Fuente: anieto2k.com
1 comentario:
Muchas gracias por este hint, me estbaa volviendo loco para hacer andar un listado de productos hecho con divs inline-block en IE
puse las lineas que me faltaban y anduvo de una
Publicar un comentario