Float a div right, sin impactar en el diseño

Question

Quiero flotar un div a la derecha en la parte superior de mi página. Contiene una imagen cuadrada de 50 píxeles, pero actualmente tiene un impacto en el diseño de los 50 píxeles superiores de la página.

Actualmente su:

<div style="float: right;"> 
    ... 
</div> 

Probé z-index como pensaba que sería la respuesta, pero no podía ponerlo en marcha.

Sé que es algo simple que me falta, pero parece que no puedo encontrarlo.

Answer 1

¿Qué quieres decir con impactos? El contenido fluirá alrededor de un flotador. Así es como funcionan.

Si desea que aparezca por encima de su diseño, intente establecer:

z-index: 10; 
position: absolute; 
right: 0; 
top: 0; 

Answer 2

Intente configurar su position en absolute. Eso lo saca del flujo del documento.

Answer 3

Si no desea que la imagen de afectar a la disposición en absoluto (y flotar en la parte superior de otro tipo de contenido) se puede aplicar el siguiente CSS a la imagen:

position:absolute; 
right:0; 
top:0; 

Si desea que le permite flotar a la derecha de una sección de los padres en particular, usted puede agregar position: relative a esa sección.