28173 sujets

CSS et mise en forme, CSS3

Salut à tous

Voila j'étais super content je venais de terminer mon premier site 100% valide xhtml strict !! Smiley langue voici l'adresse du site : www.pougun.com

Puis je me suis dis , "bon ben on va quand même voir ce que ça donne avec firefox pour être sur"...Et la, damned ! le site n'est pas du tout centré comme il devrait l'être (et comme il l'est d'ailleurs avec IE) mais il est aligné sur la gauche...

Aprés un petit cri aigu de panique à la vue de ce désastre sous firefox, je me dis "ok ok , pas de problème ça doit être un léger oubli du côté du CSS je vais corriger ça en 2 - 2"...Mais maintenant le problème c'est que ça fait 2 heures que je suis dessus et que j'ai toujours pas trouvé ! grrrr

Personne n'aurait une petite idée ? ce serait vraiment réellement trés gentil !
Modifié par shantee (29 Mar 2007 - 20:44)
Salut,

Tout d'abord un premier conseil, fais plutot en premier ton site pour les navigateurs qui respectent les standards comme Firefox ou Opera et ensuite pour Internet Explorer, tu prendras des meilleurs habitude.

Un autre conseil vérifies au fur a mesure du dévelopement l'affichage de ton site sur les différents navigateurs, ça t'éviteras des grosses surprises et de te lancer dans des impasses a vouloir faire des truc impossible sur certains navigateurs.

Concernant ton probléme voici une solution :

Imaginons que tu as une div général englobant ton contenu avec une classe "content"

body{text-align:center}
.content{margin: 10px auto 10px auto;width:85%;text-align:left}


Voilà c'est tout.

Explication: les navigateurs valides comprennent "auto" et assigne donc la motié de la difference entre ta div content et la taille de ta fenêtre comme marge droite et gauche. Ce qui revient à centrer la div quelle que soit ça taille.
Internet Explorer centre les div type block comme les div en ligne, text-align:center au body lui suffit donc, par contre il ne comprend pas "auto".
Modifié par matmat (29 Mar 2007 - 03:15)
Hello !
matmat a écrit :
Internet Explorer centre les div type block comme les div en ligne, text-align:center au body lui suffit donc, par contre il ne comprend pas "auto".
Attention, IE interprète très bien les marges automatiques pour le centrage horizontal à partir de sa version 6. Smiley cligne
Merci pour vos réponses...En fait tu m'as un peu mis sur la voie matmat avec ton histoire de margin:auto; Smiley cligne

sauf que ça venait pas du body, mais du <div> qui s'occupe d'afficher les coins arrondis de mon site...Bref en tout cas maintenant il est bien centré sous firefox alors merci Smiley smile

Ah oui et merci pour ce bon conseil aussi ! J'ai installé opera et j'ai mi firefox comme navigateur par defaut dans la fonction "preview" de dreamweaver hihi