Posicionamiento

Tamaño

Las propiedades width y height definen el tamaño de un elemento mediante un valor numérico (con su unidad) o un porcentaje (con respecto al elemento padre).

Las propiedades min-width y min-height definen el tamaño mínimo de un elemento mediante un valor numérico (con su unidad) o un porcentaje (con respecto al elemento padre).

Las propiedades max-width y max-height definen el tamaño mínimo de un elemento mediante un valor numérico (con su unidad) o un porcentaje (con respecto al elemento padre).

Overflow

La propiedad overflow establece el tratamiento que debe dar el navegador al contenido que no cabe en el elemento padre. Los valores posibles de esta propiedad son: visible, hidden (oculto), scroll (mostrar siempre barras de desplazamiento), auto (mostrar barras cuando sea necesario).

Si está definido el tamaño del elemento y overflow tiene el valor visible, Internet Explorer no hace caso de la altura del elemento y lo amplía hasta abarcar todo su contenido, mientras que en Mozilla el contenido desborda el elemento y se superpone a los siguientes elementos.

Esquema de posicionamiento

Existen tres esquemas de posicionamiento: normal, flotante o absoluto:

• El esquema normal es el habitual, es decir, los elementos se muestran en la pantalla en el mismo orden en que se encuentran en la página.
• El esquema flotante es el que permite que un elemento se "salga" de su posición normal y se muestre a la izquierda o a la derecha del todo.
• El esquema absoluto permite definir la posición exacta de un elemento

Esquema flotante

La propiedad float establece el esquema de posicionamiento flotante de un elemento. Los elementos que se encuentran a continuación del elemento flotante fluyen a lo largo del elemento flotante (salvo que tengan establecida la propiedad clear)

Esquema absoluto

La propiedad position establece el esquema de posicionamiento absoluto de un elemento. Existen cuatro tipos en el esquema de posicionamiento abosluto: estático (static), relativo (relative), absoluto (absolute) y fijo (fixed).

Posicionamiento fijo (fixed)

Cuando se establece la propiedad position como fixed, el elemento se sitúa en la posición indicada y no se puede desplazar. Aunque la página sea larga y se pueda desplazar verticalmente, el elemento fijo estará siempre en la misma posición de la pantalla.

Internet Explorer no es capaz de representar este tipo de posicionamiento.

Ejemplo de posicionamiento fijo