Probleme de min-height

Bonjour,
je rencontre un probleme de hauteur de page.. j'ai mon contenu qui dépasse de mon fond

http://hazemann.celeonet.fr/index.php/hebergement.html

voici mon css

div#header{
	position:relative;
    height:116px;
	width:960px;
    margin:0;
    border:0px solid #000;
	background: url(../images/header.jpg) no-repeat;
    }

div#container{
	position: relative; /* on positionne le conteneur */ 
	margin-left: auto; 
	margin-right: auto;
	margin-top:5%;
	width: 960px; 
	text-align: left;
	border:0px solid red;
	-moz-box-shadow: 1px 1px 5px #333;
	-webkit-box-shadow: 1px 1px 5px #333;
	box-shadow: 1px 1px 5px #333;
	}
div#content {
position:relative;
    border: 0px solid #000000;
    min-height:470px;
	height:auto !important;
	height:470px;
	background: #fff url(../images/menu.jpg) repeat-y;
}
div#left{
position:relative;
	color:#fff;
    width:290px;
	float:left;
    border: 0px solid #000000;
}
div#page{
    position: relative;
	float:left;
	padding:0px;
	width:670px;
    border:0px solid #000000;
    }

savez-vous d'où peu venir mon problème ?

Bonjour
Oui, le problème vient du fait que tu utilises ton bloc #page comme élément flottant.
Alors, je ne sais pas trop pourquoi tu as décidé de faire ça, mais en tout cas, c'est totalement inutile.
Du coup, l'élément étant flottant, il n'est plus pris en considération par les blocs parents pour fixer la taille de l'ensemble. Résultat : ton contenu flottant dépasse du bloc parent.

La solution : supprime le float:left;

Au passage, pour le même bloc, "border : 0 solid #000000;" ne sert à rien et revient à "border : none;" qui est la valeur par défaut d'un bloc div. Cet attribut border est inutile.

A part ça, à quoi sert le "font-size : 100.01%" de la balise body ? idem pour select, input, textarea qui ont 99%...

Les marges de l'élément form n'ont pas besoin d'être mises à 0.

Enfin voilà

merci pour ton aide pixelb..
en effet le float était de trop.. bien vu

pour les border à 0px... c'est juste pour mes tests..
les valeurs à 100% viennent de la feuille de style "reset" de mon CMS (Contao ex. Typolight)
Modifié par thomasv (30 Jun 2010 - 12:47)

j'ai un probleme avec ie8... mon texte dépasse du site !

comment dois-je faire ?
Modifié par thomasv (30 Jun 2010 - 12:47)

Salut,

Quand je vois un code CSS de ce genre :

div#content { 
    min-height:470px; 
    height:auto !important; 
    height:470px; 
} 

Je me dis qu'il y a de la surcharge inutile, voire périlleuse. Je te conseille vivement de corriger ton code comme suit :
feuille de style pour tous navigateurs

div#content { 
    min-height:470px;
    /* On ne déclare que la propriété min-height */
} 

feuille de style corrective pour IE 6 (appelée via un commentaire conditionnel)

div#content { 
    height:470px;
} 

thomasv a écrit :
j'ai un probleme avec ie8... mon texte dépasse du site !

comment dois-je faire ?

Ajoute overflow: hidden à div#content.

en effet ça marche pieux avec tes indications ! merci beaucoup pour vos explications... c'est hyper sympa !
par contre j'ai un problème avec ma colonne de gauche... le contenu de droite désactive les liens ! !

oops j'ai posté le message trop vite... je viens de trouver l'astuce..

z-index:2000;

Modifié par thomasv (30 Jun 2010 - 13:57)