Discussion :

[dream_of_australia]

Bonjour tout le monde !

J'ai un petit souci d'affichage :

• sous IE 7 :
  
  
• sous FF :
  

Mon code HTML :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<div id="entete">
     <div id="titre_entete">&nbsp;Forum : authentification</div>
     OPTIONNEL (conditions en php) : <div id="user_entete">Nom&nbsp;</div> 
</div>

Mon code CSS :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
 
body { 
	background-color:#FEF0D3; 
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;
	color:#000000;
}
#entete {
	width:100%;
	background-color:#FFCC99;
	border-style:solid;
	border-color:#000000;
	border-width:1px;
	margin:0;
	padding:0;
}
 
#titre_entete {
	float:left;
	font-size:18px;
}
 
#user_entete {
	float:right;
	font-size:8pt;
	line-height:18px;
}

Est-ce que quelqu'un sait pourquoi la couleur de fond et la bordure ne s'affichent pas correctement sous firefox ?

Merci !!

[Bisûnûrs]

Parce que l'élément entete contient deux élément en float, donc hors flux et ne sont donc pas comptés dans la hauteur totale de leur conteneur.

Pour résoudre ça, il faut créer un nouveau contexte de formatage sur le conteneur, en mettant par exemple overflow:hidden sur le div entete.

[dream_of_australia]

Effectivement c'est résolu ! Merci beaucoup !! Je n'y avais carrément pas pensé.