La propiedad display especifica como ha de mostrarse un elemento.
Sus posibles valores son.
block: Los elementos que posean la propiedad disply con valor block apareceran uno debajo del otro como si ocuparan todo el ancho de la pantalla
inline: Los elementos que posean esta propiedad con el valor inline aunque por naturaleza sean elementos block, pasaran a ser elementos inline.
No confundir con vissibility: hidden
es como si se eliminara el elemento
compact: Dependiendo del contenido, este valor crea bien un elemento caja o un elemento en línea. En cada caso se pueden aplicar distintas propiedades CSS a un elemento compacto. En un contenido de tipo caja, el elemento compacto será presentado en el margen izquierdo o a la derecho de la caja. El elemento compacto participa en el cálculo de los valores del ancho de línea para la línea corriente y del valor de la propiedad
vertical-align del elemento caja.inline-block: Los elementos que tengan la propiedad display con el valor inline-block, pueden estar uno al lado del otro, es decir, pueden crear una cuadricula.
Un elemento con la propiedad CSS display: inline-block coloca los elementos en línea pero conservando las propiedades de bloque (alto, ancho, margen, relleno, ...), pero cuando establecemos una lista con el atributo display: inline-block aparece una separación de 4 píxeles entre los elementos de la misma,La propiedad float genera el mismo efecto pero si quieres sitios web mas fluidos deberás usar la primera, donde obtenemos una cuadricula mas fácilmente.
diferencia float y display inline-block
inline-block
inline-table
run-it
