CSS : Plusieurs blocs de même hauteur côte à côte

nicopulse · 17/01/2011, 12h51

Bonjour à tous

Dans une page web, j’ai 4 blocs div qui flottent l’un à coté de l’autre et qui contiennent chacun des textes différents.

Code css :

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

1
2
3
4
5
 
.float {
  float: left;
  width: 25%;
}

Code html :

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

1
2
3
4
5
6
7
 
<div>
  <div class="float"> … </div>
  <div class="float"> … </div>
  <div class="float"> … </div>
  <div class="float"> … </div>
</div>

Colorant le background de chacun de ces div, je voudrais que la hauteur soit la même pour tous. A savoir celle du bloc contenant le plus de texte (je ne sais pas par avance lequel c’est : page dynamique).

Pour faire simple, comme ça :

Si quelqu’un sait faire ça, ou connait un tuto sur le web pour faire ça avec plus de 2 colonnes, je prends.

Merci d'avance

winow · 17/01/2011, 13h13

pourquoi ne pas mettre height a 100% ou alors j'ai pas compris la question ?

ou pluto mettre le height du div principale a 25% et mettre le height de la class float a 100%

iperfranck · 17/01/2011, 13h29

En CSS, je vois pas. Moi je ferais ça en javascript. (besoin de code?)

nicopulse · 17/01/2011, 13h49

Citation:

Envoyé par winow

pourquoi ne pas mettre height a 100%

Cela ne fonctionne pas ^^

winow · 17/01/2011, 16h55

j'ai fait ca

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
 
<html>
<head>
 
 
<style type="text/css">
 
#premierdiv{height:25%}
 
.floatred {
  background-color:red;
  float: left;
  width: 25%;
  height:100%
}
 
.floatblue {
  background-color:blue;
  float: left;
  width: 25%;
  height:100%
}
</style>
 
 
</head>
<body>
 
 
<div id="premierdiv">
  <div class="floatred"> texte 1 </div>
  <div class="floatblue"> texte 2 </div>
  <div class="floatred"> texte 3 </div>
  <div class="floatblue"> texte 4 </div>
</div>
 
 
</body>
</html>

ca fait ce que tu dit ou alors j'ai pas compris ?

17/01/2011, 13h13	#2
winow Membre expérimenté Inscription : novembre 2004 Messages : 599 Détails du profil Informations personnelles : Âge : 47 Informations forums : Inscription : novembre 2004 Messages : 599 Points : 516 Points : 516	pourquoi ne pas mettre height a 100% ou alors j'ai pas compris la question ? ou pluto mettre le height du div principale a 25% et mettre le height de la class float a 100% __________________ . Why . //------------------
	00

17/01/2011, 13h29	#3
iperfranck Invité de passage Inscription : janvier 2011 Messages : 3 Détails du profil Informations forums : Inscription : janvier 2011 Messages : 3 Points : 2 Points : 2	En CSS, je vois pas. Moi je ferais ça en javascript. (besoin de code?)
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email