web-dev-qa-db-fra.com

Flotter un div à droite, sans impact sur la conception

Je veux faire flotter un div vers la droite en haut de ma page. Il contient une image carrée de 50 pixels, mais il a actuellement un impact sur la disposition des 50 pixels supérieurs de la page.

Actuellement, c'est:

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

J'ai essayé z-index car je pensais que ce serait la réponse, mais je n'ai pas pu le faire.

Je sais que c'est quelque chose de simple qui me manque, mais je n'arrive pas à le comprendre.

csshtmlcss-float
26
NikolaiDante

Qu'entendez-vous par impact? Le contenu circulera autour d'un flotteur. Voilà comment ils fonctionnent.

Si vous souhaitez qu'il apparaisse au-dessus de votre conception, essayez de définir:

z-index: 10;  
position: absolute;  
right: 0;  
top: 0;
58
Richard Garside

Si vous ne voulez pas que l'image affecte la mise en page (et flotte au-dessus d'un autre contenu), vous pouvez appliquer le CSS suivant à l'image:

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

Si vous voulez qu'il flotte à droite d'une section parent particulière, vous pouvez ajouter position: relative à cette section.

10
EoghanM

Essayez de définir son position sur absolu. Cela le retire du flux du document.

3
nickf