[CSS] div et float

**zan001** · 20/12/2005, 11h25

bonjour,

j'ai un probleme de css,

voila ce que j'ai en gros :

Code :

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

1
2
3
4
<div id="A">
    <div id="B">contenuB</div>
    <div id="C">contenuC</div>
</div>

et la css :

Code :

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

1
2
3
4
5
6
7
8
9
10
div#A {
    background-image:url(ihm/fond.jpg);
    background-repeat:repeat-y;
}
div#B {
    float:left;
}
div#C {
    float:left;
}

sous IE aucun probleme
mais sous firefox, mon fond ne se repete pas, l'image s'affiche une fois et les div B et C s'affichent par dessus independamment de A

voila, si vous avez des idées
merci

**siddh** · 20/12/2005, 11h41

met un width peut etre

**zan001** · 20/12/2005, 11h54

en fait il y a deja un width, au trois div
le pb vient plutot du height. et je ne peux pas fixer la hauteur de A car B peux avoir une hauteur variable.
Et si je ne la fixe pas le fond de A ne se repete pas

**siddh** · 20/12/2005, 12h08

si tu met un height a A, et que B necessite que A soit plus grand, il s'agrandira

**zan001** · 20/12/2005, 14h00

c'est justement la tout le probleme.
ce que tu me dis est efficace pour IE

mais pas pour firefox, j'ai l'impression que de declarer avec un float B et C fait que A ne depend plus de la taille de B

**siddh** · 20/12/2005, 14h04

tu leur a mis des positions absolues ?
ca expliquerais ton probleme

**jeff_!** · 20/12/2005, 14h18

je suis pas sur d'avoir compris
en fait b et c recouvre A c'est normal sous ff

Code :

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

1
2
3
4
5
<div id="A">
    <div id="B">contenuB</div>
    <div id="C">contenuC</div>
<hr/>
</div>

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
#A {
    background-image:url(ihm/fond.jpg);
    background-repeat:repeat-y;
}
#B {
    float:left;
}
#C {
    float:left;
}
hr{
clear:left;
visibility;hidden;
}

si j'ai compris ton probleme ce sode devrai le resoudre

**zan001** · 20/12/2005, 14h36

pas de position absolue.
voila ma page de test :

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
28
29
30
31
32
33
34
35
36
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style type="text/css" media="screen">
	#A {
		width:900px;
		height:20px;
		background-image:url(blog_fond.jpg);
		background-repeat:repeat-y;
	}
	#B {
		float:left;
	}
	#C {
		float:left;
	}
</style>
<title>title</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
 
<body>
 
	<div id="A">
	 	<div id="B">
	  	<p>sdgdsfgdsg</p><p>sdgsdggf</p><p>ytruytrutr</p>
	 	</div>
 
	 	<div id="C">
	  	<p>sdgdfsgdsfg</p><p>&nbsp;</p><p>fhgngfnnfhgf</p>
	 	</div>
	</div>
 
</body>
</html>

y'a pas plus simple... bah firefox ne retaille pas A en fonction du height de B ou C

ou alors float:left; est-il considéré comme un positionnement absolue par ff.
dans ce cas la quelle solution me reste-t-il pour aligner horizontalement B et C ?

[CSS] div et float

CSS

Vue hybride

Discussions similaires

Partager

Partager