Centrer un groupe de div

**anadoncamille** · 08/02/2020, 01h51

Bonjour à tous,

je voudrais centrer un groupe de composants div enfants d'un div centré mais quand je leur applique le paramètre position:relative, les composants sont centrés horizontalement mais perdent leur cohérence verticale. Je ne comprends pas.

Voici ce que j'ai avec des position:absolute :
Nom : Image1.jpg
Affichages : 340
Taille : 36,6 Ko

Nom : Image1.jpg
Affichages : 340
Taille : 36,6 Ko

Et voici ce que j'obtiens en appliquant des position:relative :
Nom : Image2.jpg
Affichages : 332
Taille : 36,2 Ko

Comme vous pouvez le voir, l'image est bien centrée mais les deux éléments qui l'encadrent à sa gauche et à sa droite se retrouvent projetés en dessous.
Que se passe-t-il ?

Voici le début de mon code, concernant les 3 éléments mentionnés :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
  <body bgcolor=#000000>
    <div style="top:0px; width:950px; margin-left:auto; margin-right:auto">
      <div style="position:absolute; left:180px; top:36px; width:600px; height:450px; ">
        <img src="gfx/siteLogo.jpg">
      </div>
      <div class="vtxt1" style="position:absolute; left:782px; top:212px; width:130px; height:84px; background:#222222; border:2px solid #111111;">
        <a href="ptp.html"><br>autres<br>cr&eacute;ations</a>
      </div>
      <div class="vtxt1" style="position:absolute; left:37px; top:232px; width:130px; height:84px; background:#222222; border:2px solid #111111;">
        <a href="guide.html#installation"><br>installer<br>AnAcondA</a>
      </div>

Comment puis-je faire pour centrer le groupe de div qui constitue ma page d'accueil sans perdre leur agencement ?

**NoSmoking** · 11/02/2020, 11h00

Bonjour,
rapidement je dirais que trop de position:absolute tue l'absolute, mais si tu veux que cela suive il te faut utiliser autre chose comme unité que les px, les % devraient faire l'affaire.

Ton image « logo » devrait être en image de fond.

Autre chose, utilise plutôt les balises <style></style> pour placer ton CSS.

**anadoncamille** · 11/02/2020, 13h38

Après quelques tests, j'ai passé toutes les balises en position:relative et j'ai recalculé toutes les positions. Le positionnement en pourcentage n'a pas fonctionné, par contre j'ai passé l'image en image de fond. Maintenant la page d'accueil de mon site est centrée, ça fonctionne bien. Merci pour ton soutien, NoSmoking.

Centrer un groupe de div

Centrer un élément en CSS

Discussions similaires

Partager

Partager