probleme XHTML/CSS

Version imprimable

19/02/2006, 23h09
GTJuanpablo

probleme XHTML/CSS

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
20/02/2006, 09h02
GTJuanpablo

quelqu'un peut m'aider?
20/02/2006, 10h21
_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é.
20/02/2006, 10h39
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.
20/02/2006, 10h43
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;
20/02/2006, 10h46
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
20/02/2006, 10h48
Huntress

Sous IE aussi :? .... hum alors là ça vient d'ailleurs je pense, parce que j'ai jamais eu ce problème...
20/02/2006, 10h59
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... :wink: :wink:
20/02/2006, 11h28
ilood

Bonjour

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

:arrow: solution avec float et display: table

Bon courage.
20/02/2006, 11h41
GTJuanpablo

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

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:

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:

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?

20/02/2006, 21h13
GTJuanpablo

personne?