Skip to main content

Visit Mozilla.org

CSS:float

De MDC


<< Volver

[editar] Resumen

La propiedad float especifica si un elemento debe salir del flujo normal y aparecer a la izquierda o a la derecha de su contenedor, donde los elementos de texto y los en línea aparecerán a su alrededor.

Un elemento flotante es un elemento en el que el valor calculado de float no es igual a none.

Nota: Al referirse a una propiedad desde JavaScript como un miembro del objeto element.style, hay que escribir la propiedad como cssFloat (ver la lista en DOM:CSS). Atención: IE llama a esta propiedad styleFloat.

[editar] Sintaxis

float: left | right | none | inherit

[editar] Valores

  • left : El elemento flota a la izquierda de su bloque contenedor.
  • right : El elemento flota a la derecha de su bloque contenedor.
  • none : El elemento no flota.

[editar] Ejemplos

Ver ejemplos en acción 

<html>
 <head>
  <style type="text/css">
   b
   {
     font-size: 25px;
     float:right;
   }
  </style>
 </head>
 <body>
 
  <p>
    <b>Hola!</b>
        Esto es un poco de texto. Esto es un poco de texto. Esto es un poco de texto.
        Esto es un poco de texto. Esto es un poco de texto. Esto es un poco de texto.
        Esto es un poco de texto. Esto es un poco de texto. Esto es un poco de texto.
        Esto es un poco de texto. Esto es un poco de texto. Esto es un poco de texto.
        Esto es un poco de texto. Esto es un poco de texto. Esto es un poco de texto.
        Esto es un poco de texto. Esto es un poco de texto. Esto es un poco de texto.
        Esto es un poco de texto. Esto es un poco de texto. Esto es un poco de texto.
        Esto es un poco de texto. Esto es un poco de texto. Esto es un poco de texto.
        Esto es un poco de texto. Esto es un poco de texto. Esto es un poco de texto.
        Esto es un poco de texto. Esto es un poco de texto. Esto es un poco de texto.
        Esto es un poco de texto. Esto es un poco de texto. Esto es un poco de texto.
        Esto es un poco de texto. Esto es un poco de texto. Esto es un poco de texto.
  </p>
 
</body>
</html>

[editar] Notas

FALTA: explicar cómo se posiciona un elemento flotante. Mención de contexto de formación de los bloques. (A traducir de en.)

[editar] Especificaciones

[editar] Compatibilidad de navegadores

Navegador Versión mínima
Internet Explorer 4
Netscape 4
Opera 3.5

[editar] Ver también

clear, display, position

Obtenido de "http://developer.mozilla.org/es/docs/CSS:float"