28172 sujets

CSS et mise en forme, CSS3

[RESOLU]Problem de centrage de mon conteneur

Bonjour je viens de suivre ce tutoriel trouvé sur pompage et concernant le positionnement du pied de page afin qu'il reste toujours en bas de page et qu'importe le taille du contenu du site. voici donc les code HTML et CSS.

Je tiens a préciser que juste à cause de ce positionnement de pied de page j'ai du reprendre au complet la refonte de mon codage css. C'est peut etre ça le début ... Smiley lol
CSS
html, body {
	height: 100%;
}
body {
	margin: 0;
	padding: 0;
	font: 12px/1.5 verdana, arial, helvetica, sans-serif;
}
#container {
	position: relative;
	min-height: 100%;
	height: 100%;
	voice-family: "\"}\"";
	voice-family: inherit;
	height: auto;
}
html>body #container {
	height: auto;
}
#content {
	padding: 10px;
	background-color: #a6c;
	padding-bottom: 48px;
}
#footer {
	position: absolute;
	bottom: 0;
	padding: 10px;
	background-color: #609;
	width: 75%;
}

HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<title>Planetlibre - Accueil</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15" />
<link rel="stylesheet" type="text/css" media="screen" href="style.css" />
<meta http-equiv="Content-Language" content="fr" />
</head>

<body>
<div id="containre">
<h1 id="header"><a href="index.html" title="Planetlibre - Accueil">><span>Planetlibre</span></a></h1>
<div id="content">
<p>...</p>
</div>
<div id="footer">Copyright © - Planetlibre-Sep2008 - Texte et images de droit<a href="plan">Plan du site</a><a href="contact">Contact</a><a href="Partenaire.html">Partenaires</a><a href="Référencement.html">Référencement</a></p></div>
</div>
</body>
</html>


Pourriez vous m'expliquer à centrer ma page SVP.

J'ai bien essayé de placer Width: 700px; ou même 70%, mais la page reste toujours fixer sur les marges droite et gauche.

Merci a tous
Modifié par worms30 (23 Sep 2008 - 15:21)
Juste une petite remarque dans ton code html, il y a une faute dans id= "containre" au lieu de container...
Merci a toi, l'erreur venait de mon manque d'inattention. SUPEEEER Smiley lol

Problème résolu!

Si non a tout hasard serais tu comment faire pour créer plusieurs fichier style CSS afin de séparer la partie structure du site (soit le code CSS si déçu) et celle concernant l'écriture et l'apparence de mon site. Ainsi que le code à entrer dans mon fichier html?

Merci encore
Je pense que par site tu veux dire page. A ma connaissance, on attache une seule css par page ou pour plusieurs pages, sauf pour des corrections et dans ce cas, on met un commentaire conditionnel dans le html. Mais surtout, je ne vois pas l'intérêt de la séparation que tu veux faire.
Si c'est pour organiser mes feuilles de style

Du genre
-une pour tout se qui concerne la typographie de mon site (ou mes pages)
-une pour la structuration
-une pour tout se qui attrait au style visuel
-une autre pour l'impression
-,...

Voir ces articles pour l'organisation des feuilles de style
http://blog.legizz.com/?329-comment-bien-organiser-vos-fichiers-css
http://romy.tetue.net/spip.php?article332
http://gou.blogspot.com/2004/10/structurer-ses-css.html

Voici ma feuille de style nommé "style.css", qui me permet d'appller les autres feuilles composant l'intégralité de mon site. Ainsi pas obliger de fouiller dans mon codage sur feuille de 50m de long pour modifier un simple backgroud ou autres détails.

Html 

<link rel="stylesheet" type="text/css" media="screen" href="style.css" />



Feuille de style CSS "style.css":

/* Importation des feuilles de Styles
composant mon ste.
--------------------------------------- */
@import url("mise_en_page.css") screen;
@import url("visuel.css") screen;
@import url("typographie.css") screen; 
@import url("impression.css") screen;
@import url("divers.css") screen;


Merci encore à toi
Modifié par worms30 (23 Sep 2008 - 15:21)
Sujet clos
Aller à