Meme Hauteur pour deux div

**bb62** · 30/07/2008, 09h18

Bonjour,

Voila mon probleme, j'ai deux div une gauche et une droite, j'aimerai que quand la taille de la div de droite est plus grande que celle de gauche, celle de gauche se met à la même hauteur que celle de droite. Voici un code exemple:

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
 
<html>
<head>
	<style type="text/css">
 
		#page {
			height : auto ;
			width : 100% ;
		}
 
		#gd {
			height : auto;
			width : 100% ;
		}
 
		.gauche {
			float : left ;
			background-color : #FF0000 ;
			width : 50% ;
			height : auto;
                        margin-left : -1px ;
		}
		.droite {
		   background-color : #999999 ;
			width : 50% ;
			float : right ;
			height : auto ;
		}
 
		.clear {
			clear : both;
		}
 
	</style>
</head>
<body>
	<div id="page">
		<div id="gd">
			<div class="gauche">GAUCHE</div>
			<div class="droite">DROITE <br> DROITE</div>
		</div>
                <div class="clear">&nbsp;</div>
	</div>
 
</body>
</html>

Merci d'avance

**laurentibus** · 30/07/2008, 10h01

ah c'est chiant ca ....

il faut que tu lance une recherche ici même dans le forum développement web (HTML ou CSS plus précisément ) car le même sujet a été traité et une réponse apporté .....

**bb62** · 30/07/2008, 10h48

J'ai trouvé une solution mais le problème, si on met une bordure au deux div, on n'a pas la bordure du bas pour la div de gauche.

Voici le code :

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
 
<html>
<head>
	<style type="text/css">
 
 
		#gd {
			height : auto;
			width : 100% ;
			overflow: hidden; 
		}
 
		.gauche {
			float : left ;
			background : #FF0000 ;
			width : 45% ;
			height : auto;
			margin-bottom: -2000px; padding-bottom: 2000px;
			border: 1px solid black; 
		}
		.droite {
		   background : #999999 ;
			width : 45% ;
			float : right ;
			height : auto ;
			border: 1px solid black; 
		}
 
 
 
 
	</style>
</head>
<body>
	<div id="gd">
		<div class="gauche">GAUCHE</div>
		<div class="droite">DROITE <br> DROITE <br> DROITE</div>
	</div>
</body>
</html>

Merci d'avance

**laurentibus** · 30/07/2008, 11h07

c'est le height : auto .. qui gère tout ca bien ??? ( bon apart la bordure mais

)

ps : penses au tag

**bb62** · 30/07/2008, 11h24

Non c'est pas le height:auto qui gére tout ça bien mais c'est le overflow: hidden; et margin-bottom: -2000px; padding-bottom: 2000px;

Par contre je ne met pas encore le tag résolu car j'ai toujours ce souci de bordure.

Merci d'avance.

**laurentibus** · 30/07/2008, 11h30

c'est vrai j avais zappé la bordure

peut etre que cela viens d'une contradiction entre tres proprietes ..... ????
cf difference des proprietes entre div gauche et droite :

Code :

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

margin-bottom: -2000px; padding-bottom: 2000px;

( je dis bien peut etre

)

++

Meme Hauteur pour deux div

Dimensionnement en CSS

Vue hybride

Discussions similaires

Partager

Partager