Discussion :

[GTJuanpablo]

bonjour a tous,

http://benjaminta.free.Fr/capturegarage.png


j'ai un probleme avec mes div en css:
Comme on voit sur l'image, j'ai une div en haut pr la banniere, une div a gauche pr le menu, une div au milieu(jaune) pr le contenu et une div a droite , et enfin une div en bas pr le copyright.

Le probleme est que le background de ma div du milieu et de droite ne suive pas en vertical le contenu (comme on peut le voir sur l'image)

pouvez vous m'aider?

merci d'avance

[GTJuanpablo]

quelqu'un peut m'aider?

[_dranece_]

C'est normal puisque les div s'ajuste en hauteur à leur contenu (enfin sans ton code, c'est tout ce que je peux dire). Regardes les réponses à ce post, ça devrait t'aider:
[Résolu] [css] Compatibilté.

[GTJuanpablo]

merci pour le lien, mais mon probleme est que meme sans contenu, mon div doit descendre jusqu'en bas, jusqu'a ma div footer, ce qui est différent du probleme du lien que tu m'a donné.

en fait sur 3 div, les 3 doivent descendre au meme niveau que celle qui a le plus de contenu, et celle du bas doit s'afficher seulement en bas des 3.

[Huntress]

Si j'ai bien compris ton problème, pour faire "descendre" un div sous FF, tu rajoutes au bas de celle-ci (à l'intérieur) un <hr class="spacer" /> avec comme styles un clear: both; et un visibility: hidden;

[GTJuanpablo]

humm ok, j'essayerai ce soir, je n'ai pas mon code sous la main la..

mais le prob est aussi sur ff que sur ie

[Huntress]

Sous IE aussi .... hum alors là ça vient d'ailleurs je pense, parce que j'ai jamais eu ce problème...

[GTJuanpablo]

je me suis peut etre mal exprimé alors, le probleme est dur a cerné, je vais essayé de mieux m'expliquer:

j'ai 5 div regroupé dans une autre div:

une div pour la banniere du haut,
une div a gauche pr le menu,
une div au centre pr le contenu,
une div a droite pour "fermer le design",
une div en bas, avec le copyright...


- ma div du centre est la plus longue, pas de soucis donc avec
- j'aimerais que ma div de gauche descende aussi bas que ma div du centre, et ne s'arrete pas a la fin de mon menu
- idem pr la div de droite

Autre soucis avec ma div du bas, elle se met a la suite de ma div du centre pr le texte(copyright) , la pas de soucis, mais le background-image se met a la suite de ma div centre comme si cette derniere n'avait pas de contenu.(comme on le voit sur l'image)


je pourrais résoudre ce probleme en mettant un tableau, mais le xhtml/css c quand meme plus propre

voila la je crois que c plus clair...

[ilood]

Bonjour

Il faut donc créer trois colonnes de même hauteur... lien :

solution avec float et display: table


Bon courage.

[GTJuanpablo]

ok merci c ça que je cherchais
je teste ce soir, ça va aussi régler le prob de la div footer?

[GTJuanpablo]

http://benjaminta.free.fr/garagecapture.png

voila g apporter les modifs, cmieux mais il y a encore le prob du menu de gauche et de droite. Voici mon code HTML:

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
<div id="wrapper">
	<div id="header">
 
	</div>
	<div id="container">
		<div id="left">
		 		<a href="index.php?option=com_frontpage&Itemid=1">Accueil</a><br /> <br />
		<a href="index.php?option=com_ponygallery&Itemid=2">Gallerie</a><br /><br />
		<a href="index.php?option=com_content&task=blogcategory&id=1&Itemid=4">News</a><br /><br />
		<a href="index.php?option=com_virtuemart&Itemid=5">Annonces</a><br /><br />
		<a href="index.php?option=com_content&task=blogcategory&id=4&Itemid=6">Contacts</a><br />
 
		</div>
		<div id="content">
 
		  <?php mosMainBody(); ?>
		</div>
		<div id="right">
 
 
		</div>		
 
		<div id="footer">
			<br /><br />
			Copyright © 2005-2006 Garage - Tous droits réservés
		</div>
	</div>
</div>

et le 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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
#wrapper 
{
	margin-left:auto;
	margin-right:auto;
	margin-top:10px;
	width:800px;
	background-image:url(../images/site_bg.gif);
 
	text-align:left;
 
	display:table;
 
}
 
#header {
	background-image:url(../images/ban_haut.png);
	background-repeat:no-repeat;
	height:239px;
	width: 800px;
	display:table;
 
 
}
 
#content {
	background-image:url(../images/milieu.png);
	float:left;
	width:587px;
	background-color:#6699CC;
	margin-left:0px;
	margin-top:0px;
	height:100%;
	display:table;
 
}
 
#right {
	background-image:url(../images/droite.png);
	float:left;
	width:42px;
	background-color:#6699CC;
	margin-left:0px;
	margin-top:0px;
	height:100%;
	display: table-cell;
 
}
 
#left {
	float:left;
	width:160px;
	text-align:center;
	margin-left:0px;
	margin-top:0px;
	background-image:url(../images/gauche.png);
	background-repeat:repeat;
	font-size:13px;
	font-weight:bold;
	height:100%;
	float:left;	
	display: table-cell;
}
 
 
#footer {
 
	background-image:url(../images/bas.png);
	width:790px;
	height:99px;
	text-align:center;
	background-repeat:repeat;
	margin-left:0px;
	margin-top:0px;
	text-align: center;
	color:#CCCCCC;
	font-size:12px;
	font-weight:bold;
	clear:both;
display:table;
 
}

pouvez vous m'aider?

[GTJuanpablo]

personne?