Este diagrama ilustra el efecto de flotar una caja.
Se muestra una ventana de documento, con 8 líneas (numeradas de 1 a 8), cada una de 24px del alto. Como toda la caja de "interno" ha sido flotada a la derecha, todo el otro texto fluye alrededor de ella (sobre las lineas 1 a 4).
En el siguiente ejemplo con un elemento PRE, cada línea de 24px es simulada por dos líneas, la segunda comienza con el número apropiado. Las barras verticales representan el borde izquierdo de la caja flotante. Las líneas, tal como aparecen en la imagen, contienen:
1 El comienzo del contenido. Este 2 es el tema externo. Fin | Tema 3 del tema externo. El | interno. 4 final del contenido.
El color de texto predeterminado es negro. "Este es el tema externo" es rojo. "Tema interno" es azul. "Fin del tema externo" es rojo.