Discussion :

[hargathor]

Bonjour à tous,

Voilà j'ai un petit problème de débutant, je veu placer un div au centre de mon écran (il sera placé juste au dessus d'une image) et pour cela j'utilise margin-top et margin-left dans mon CSS. Malheureusement des que je change ma resolution d'écran le cadre se décale et le div n'est donc plus centré sur l'image de background.

Comment pui-je m'y prendre pour contrer cet effet de resolution ?

Merci d'avance pour vos réponses

[Bisûnûrs]

Un peu de code pour y voir plus clair ne serait pas de trop.

Ton div centré doit l'être quelle que soit la résolution de l'utilisateur ? Il est en position absolue ? Quand on redimensionne la fenêtre ton image de fond se déplace ou reste à sa place ?

[trotters213]

Quand tu dis "centré" c'est centré horizontalement, verticalement, ou les deux?

[nimois3O]

Bonjour,

L'attribut "auto" ne peut pas fonctionné dans ce cas ?

Pour qu'on n'y voi plus clair le code ne serais pas superflux

[mama07]

Pour pouvoir centrer ta div, tu dois lui mettre les propriété suivante :

Code :

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

1
2
3
4
5
 
width:800px;
position:absolute;
left:50%;
margin-left:-400px;

margin-left doit être 2 fois plus petit que la largeur de ta page

[trotters213]

mama07 : Ta solution ne tient plus debout si tu réduit la fenêtre (le contenu se décale normalement )

[Seta-san]

Essaye peut etre ceci :

Code :

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

1
2
3
4
 
position:absolute; 
left: 40%; 
top: 40%;

Apres ca va dépendre de la taille global de ton div.
Essaye d'autre valeur.

[Wharenn]

Code :

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

1
2
3
4
5
6
 
width: 200px;
margin: auto;
margin-top: 20px;
margin-bottom: 20px;
...

[hargathor]

Merci à tous j'ai résolu le prb, désolé de ne pas avoir répondu plus tôt. Ca marche mieu avec le "absolute"

[trotters213]

Merci à tous j'ai résolu le prb, désolé de ne pas avoir répondu plus tôt. Ca marche mieu avec le "absolute"

Mauvaise idée, la bonne solution est celle de Wharenn.