[CSS] centrer ses DIVs sur la page

centrer ses DIVs sur la page [CSS] - HTML/CSS - Programmation

Marsh Posté le 11-09-2004 à 17:01:03    

salut, je suis en train de monter un site web (comme c'est original!),
 
je suis pas super calé pour le CSS et je voudrais centrer ma page sur l'explorateur, je mets quoi dans ma CSS pour ça ?


---------------
London Box Office: Comédie Musicale Londres
Reply

Marsh Posté le 11-09-2004 à 17:01:03   

Reply

Marsh Posté le 11-09-2004 à 17:06:09    

effisk a écrit :

salut, je suis en train de monter un site web (comme c'est original!),
 
je suis pas super calé pour le CSS et je voudrais centrer ma page sur l'explorateur, je mets quoi dans ma CSS pour ça ?


 
en largeur :
 
le div conteneur (celui qui contient le div que tu veux centrer) : text-align : center;
 
le div contenu (celui qui contient ce que tu veux centrer) :  
 
margin-left : auto;
margin-right : auto;
 
pour la hauteur, on ne peut pas (en tous cas, pas simplement, mais en trichant --> solutions pourrites jusqu'à la moelle).
 
Seule soluce sans tricher : le conteneur est une table avec une cellule unique.


---------------
Expert en expertises
Reply

Marsh Posté le 11-09-2004 à 17:12:19    

merci Hermes,
 
pour le div conteneur, text-align : center; ça va aussi centrer les images (c'est principalement des images mon truc) ?


---------------
London Box Office: Comédie Musicale Londres
Reply

Marsh Posté le 11-09-2004 à 17:12:32    

bon j'esaye de toute façon, merci


---------------
London Box Office: Comédie Musicale Londres
Reply

Marsh Posté le 11-09-2004 à 17:36:29    

bon en fait je veux centrer absolument tout le contenu de ma page, donc le div conteneur à la base.
 
donc soit je le centre, soit le le fais aussi large que la fenêtre pour ensuite faire comme Hermès a dit.
 
Je ne sais faire ni l'un ni l'autre.. :(
 
pour l'instant j'ai mis une balise <center> mais c'est pas très classe...


---------------
London Box Office: Comédie Musicale Londres
Reply

Marsh Posté le 11-09-2004 à 17:37:38    

attendez, je mets mon truc en ligne


---------------
London Box Office: Comédie Musicale Londres
Reply

Marsh Posté le 11-09-2004 à 17:39:47    

Tu crées une table de 100% de haut et 100% de large avec une unique cellule.
Tu mets ton div dans la cellule.
 


---------------
Expert en expertises
Reply

Marsh Posté le 11-09-2004 à 17:41:35    

voilà la page:
 
http://www.teeoffevent.com/index.php
 
Il y a deux images, je souhaite que la petite soit située juste en dessous de la grande, et alignée sur la gauche.
 
Au final, je veux faire ça:
http://www.teeoffevent.com/index.htm


---------------
London Box Office: Comédie Musicale Londres
Reply

Marsh Posté le 11-09-2004 à 17:42:22    

Hermes le Messager a écrit :

Tu crées une table de 100% de haut et 100% de large avec une unique cellule.
Tu mets ton div dans la cellule.

ok j'essaye. merci


---------------
London Box Office: Comédie Musicale Londres
Reply

Marsh Posté le 11-09-2004 à 17:59:37    

Hermes le Messager a écrit :

Tu crées une table de 100% de haut et 100% de large avec une unique cellule.
Tu mets ton div dans la cellule.

bon j'ai essayé sans parvenir au bon résultat.
 
voilà l'adrese de la page: http://www.teeoffevent.com/index.php
 
la CSS: http://www.teeoffevent.com/files/style.css
 
j'ai dû faire un truc de travers, je ne sais pas quoi...
je veux juste centrer en largeur, la hauteur m'est égale.


Message édité par effisk le 11-09-2004 à 18:01:18

---------------
London Box Office: Comédie Musicale Londres
Reply

Marsh Posté le 11-09-2004 à 17:59:37   

Reply

Marsh Posté le 11-09-2004 à 18:22:56    

yes c'est bon j'ai réussi
 
l'info complète :
http://forums.devshed.com/archive/t-166666
 
 
Merci pour ton aide Hermes  :hello:


Message édité par effisk le 11-09-2004 à 18:23:33

---------------
London Box Office: Comédie Musicale Londres
Reply

Marsh Posté le 23-12-2004 à 13:47:34    

Par contre ton site sous mozilla, les menus partent un peu en live

Reply

Marsh Posté le 03-01-2005 à 16:30:58    

ah ouais, j'ai réglé le problème (sur http://www.teetravel.com), faut que je mette ça en ligne sur celui-là aussi.


---------------
London Box Office: Comédie Musicale Londres
Reply

Marsh Posté le 03-01-2005 à 16:36:25    

Reply

Marsh Posté le 03-01-2005 à 16:36:59    

Il est un peu lourdingue ton code, et respecte pas les guidelines de l'XHTML. Si la syntaxe est bonne et est valide (enfin j'espère, j'ai pas vérifié ;) ), tu n'as pas respecté le principe de séparation contenu/présentation. Aussi, ton code HTML ne renseigne en rien sur la sémantique et la structure de la page :(
 
Donc déjà faut virer tous les tableaux. Ensuite par exemple pour ton menu, pourquoi avoir mis une suite de div :??: Sachant qu'une div réprésente une section ou une division dans la page... Là ton menu est une liste de liens, donc il aurait fallu mettre tout ça dans une belle liste non ordonnée ;)

Reply

Marsh Posté le 04-01-2005 à 16:41:27    

FlorentG a écrit :

Il est un peu lourdingue ton code, et respecte pas les guidelines de l'XHTML. Si la syntaxe est bonne et est valide (enfin j'espère, j'ai pas vérifié ;) ), tu n'as pas respecté le principe de séparation contenu/présentation. Aussi, ton code HTML ne renseigne en rien sur la sémantique et la structure de la page :(

moui, je sais.[:arn0]
A priori la syntaxe est ok. Pour ce qui est de la séparation contenu/look, cf dessous.
 
 

FlorentG a écrit :

Donc déjà faut virer tous les tableaux. Ensuite par exemple pour ton menu, pourquoi avoir mis une suite de div :??: Sachant qu'une div réprésente une section ou une division dans la page... Là ton menu est une liste de liens, donc il aurait fallu mettre tout ça dans une belle liste non ordonnée ;)

ouaip, j'avais fait ça à l'origine, mais c'était pas classe au chargement de la page.
Le browser charge la page et ensuite la CSS, du coup le temps que la page charge les trucs étaient dans tous les sens (tous alignés verticalement sur la gauche).
 
Là j'ai un truc qui marche sur la totalité des navigateurs (encore une ou 2 bricoles à régler) et qui a une (à peu près) bonne gueule. Ca me suffit - c'est largement au-delà de la moyenne. voilà quoi.
 


---------------
London Box Office: Comédie Musicale Londres
Reply

Marsh Posté le 04-01-2005 à 16:42:42    

effisk a écrit :

ouaip, j'avais fait ça à l'origine, mais c'était pas classe au chargement de la page.
Le browser charge la page et ensuite la CSS, du coup le temps que la page charge les trucs étaient dans tous les sens (tous alignés verticalement sur la gauche).


 
FOUC ?
http://www.bluerobot.com/web/css/fouc.asp

Reply

Marsh Posté le 04-01-2005 à 16:43:34    

effisk a écrit :


Le browser charge la page et ensuite la CSS, du coup le temps que la page charge les trucs étaient dans tous les sens (tous alignés verticalement sur la gauche).


 
Comme dit fast, à part un FOUC, j'ai jamais vu ça :??:

Reply

Marsh Posté le 04-01-2005 à 17:09:12    

FOUC.
 
J'avais pas fait attention que ça n'arrivait que sur IE tiens.  
Merci pour le lien.
 
Dommage, j'aurai su comment régler le pb plus tôt, je me serai pas fait iech. Je le saurai à l'avenir...


Message édité par effisk le 04-01-2005 à 17:11:40

---------------
London Box Office: Comédie Musicale Londres
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed