<style type="text/css">
<!--
#mancheta
{
width:160px;
background-color:#e0e0e0;
margin-left:5px;
padding:5px;
float:right;
}
#lupa
{
float:left;
padding-right:10px
}
-->
</style>

Visualizar el formato resultante

Aquí aparece el texto normal de la página donde se explican las cuestiones generales.

esto es un texto que se considera importante y aparece en una mancheta

Gracias a la aplicación de los estilos tendremos una imagen flotando a la izquierda y un texto con fondo gris flotando a la derecha, mientras el texto normal fluye entre ambos. Para insertar el texto de la zona derecha lo hemos hecho aplicando el identificador id="mancheta" a un delimitador div que se ha colocado antes del segundo párrafo, mientras que para la imagen hemos aplicado el identificador id="lupa" cuyas características habíamos definido en la hoja de estilos interna.

Si ves el código podrás comprobar todos los detalles.