28172 sujets

CSS et mise en forme, CSS3

Bonjour a tous,

Avant tout j'ai consulté tous les posts concernant ce pbs, mais je suis débutant et malgré tous les bouts de codes et tutos je n'arrive tiujours pas à centrer mon site en css. Je post mon code, pouvez vous me dire l'endroit exact ou collez le code pour tout centrer?
voici le lien que j'ai trouvé sur ce site,

http://css.alsacreations.com/Faire-une-mise-en-page-sans-tableaux/Centrer-les-elements-ou-un-site-web-en-CSS

mais j'ai essayé et ca ne fonctionne toujours pas. J'espère que quelqu'un de sympa acceptera de m'aider.

Merci d'avance
voici mon code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Mon site perso</title>
</head>

<body>

<div id="I01" style="BORDER-RIGHT: 0px; BORDER-TOP: 0px; Z-INDEX: 1; LEFT: 0px; OVERFLOW: hidden; BORDER-LEFT: 0px; WIDTH: 1014px; BORDER-BOTTOM: 0px; POSITION: absolute; TOP: 0px; HEIGHT: 756px">
<div align="justify"><img id="II1" style="LEFT: 0px; WIDTH: 1014px; POSITION: absolute; TOP: 0px" height="756" alt="" src="site/design.jpg" width="1014" border="0" /></div>
</div>
<div id="H01" style="BORDER-RIGHT: 0px; BORDER-TOP: 0px; Z-INDEX: 1; LEFT: 146px; OVERFLOW: hidden; BORDER-LEFT: 0px; WIDTH: 720px; BORDER-BOTTOM: 0px; POSITION: absolute; TOP: 30px; HEIGHT: 690px">

<div align="justify">
<embed id="HI1" style="LEFT: 0px; WIDTH: 720px; POSITION: absolute; TOP: 0px; HEIGHT: 690px" pluginspage="http://www.macromedia.com/go/getflashplayer" src="site/menu.swf" width="720" height="690" type="application/x-shockwave-flash" quality="high"></embed>
</div>
</div>
</body>
</html>
Bonsoir,

Le centrage horizontal d'un élément de type block s'effectue en utilisant la valeur "auto" pour les marges externes (margin) de gauche et de droite et en donnant une largeur (width). Smiley smile <edit>Cela va s'en dire que l'élément ne doit pas être positionné ni en absolute ni en fixed Smiley cligne .</edit>

Alors que le text-align: center; sert lui à centrer le contenu texte (donc de type inline) d'un élément. Smiley cligne

Bonne continuation.
Romain
Modifié par yodaswii (26 Aug 2008 - 20:24)
Bonsoir dreamfighter,

Effectivement, pour une meilleure lisibilité il t'est demandé de mettre en forme tout code posté sur ce forum, merci de te conformer à cette règle, pas si contraignante, que tu as acceptée en t'inscrivant sur ce site Smiley cligne

Nous sommes tous débutant, ou avons tous débuté un jour, mais il n'y a pas de secret : il faut bosser, par soi-même, et pour soi-même avant tout !
Apprendre les bases du html et du css, me semble une évidence incontournable Smiley smile

Il ne serait pas inutile de parcourrir (en t'y attardant un peu) les tutoriels mis à ta disposition dans la section idoine, notamment le tutoriel Maitriser le positionnement et Comment positionner ainsi que liens qu'ils contiennent Smiley cligne

Tu y verras sans doute plus clair, et cela t'évitera de construire un site avec "des bouts de codes" trouvés çà et là sans trop comprendre ce que tu fais et d'être moins dépendant d'une bonne âme qui te donnerait un énième bout de code qui te servirait beaucoup moins que tu ne le penses Smiley smile

Concernant ta problèmatique, les méthodes de centrage décrites dans le lien que tu cites, ont très largement fait leurs preuves et tu devrais y trouver ton bonheur, cherches encore un peu Smiley cligne

Pensez également à séparer le fond de la forme.

Cdt,
Sylvain
Modifié par 6l20 (26 Aug 2008 - 21:21)