Centrage vertical Div principal

Résolu/Fermé
reedbedroom Messages postés 80 Date d'inscription lundi 11 juillet 2011 Statut Membre Dernière intervention 1 janvier 2020 - 28 févr. 2013 à 13:24
reedbedroom Messages postés 80 Date d'inscription lundi 11 juillet 2011 Statut Membre Dernière intervention 1 janvier 2020 - 28 févr. 2013 à 14:24
Bonjour,

Je travaille actuellement sur un site Web en CSS, le site mesure 1000 x 600 et j'aimerais qu'il soit centré verticalement quelle que soit la taille de l'écran de l'internaute.

Pour le centrage horizontal, aucun problème j'ai appliqué les marges automatique sur mon div principal qui contient le site :

margin-left: auto;
margin-right: auto;


Mais pour les marges verticales, cela ne fonctionne pas :

margin-top: auto;
margin-bottom: auto;


Je suppose que quelqu'un a forcément déjà rencontré ce problème, ça m'a l'air plutôt courant avec tous les site au format "rectangle" à hauteur fixe.

Merci de votre aide :D


A voir également:

3 réponses

Profil bloqué
28 févr. 2013 à 14:09
salut
essaie comme ca :

.madiv{
position:absolute;
left : 50%;
top : 50%;
border : 1px solid #aaa;
width : 1000px;
height : 600px;
}
1
reedbedroom Messages postés 80 Date d'inscription lundi 11 juillet 2011 Statut Membre Dernière intervention 1 janvier 2020 98
28 févr. 2013 à 14:18
Pas mal, j'y ai pensé mais le problème c'est que c''est l'angle supérieur gauche qui est placé à 50% à gauche et 50% du haut...
0
Profil bloqué
28 févr. 2013 à 14:22
ah oui
ben ajoute
margin-top: -300px; /* -(1/2 height) */
margin-left: -500px; /* -(1/2 width) */
0
reedbedroom Messages postés 80 Date d'inscription lundi 11 juillet 2011 Statut Membre Dernière intervention 1 janvier 2020 98
28 févr. 2013 à 14:24
Yes !!! Super ! Je n'avais pas pensé à ça... simple et efficace il faut que je me le note ;)

Merci et bonne journée !
0
reedbedroom Messages postés 80 Date d'inscription lundi 11 juillet 2011 Statut Membre Dernière intervention 1 janvier 2020 98
28 févr. 2013 à 14:00
Merci pour ta réponse.

Mais .... cela n'apporte aucune solution à mon problème, le centrage vertical. J'ai bien essayer de mettre des marges comme ceci :

margin-top: 10%;


Mais cela ne fonctionne pas non plus. De plus le client ne veux pas d'un site qui s'adapte à la largeur de l'écran de l'internaute, je ne peux donc pas lui imposer.
0
, le site mesure 1000 x 600 et j'aimerais qu'il soit centré verticalement quelle que soit la taille de l'écran de l'internaute.

Dans ce cas utilisez des % et non des valeurs fixes.
Avec des valeurs fixes vous obligez l'utilisateur à s'adapter à vos dimensions alors que toutes les mises en page d'Internet tendent vers le contraire.
Et si l'utilisateur redimensionne la fenêtre de son navigateur? S'il veut consulter 2 pages en vois à vis, vous le privez de cette possibilité pourquoi?

Vos restrictions ont de grandes chances qu'il ne reste pas à consulter vos pages mais aille voir un site correctement fait et ne l'obligeant pas à s'adapter à ce que vous imposez.
-2