Discussion :

[ripout]

Bonjour à tous.

J'essaie en vain de combiner des div comme ceci

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
<div class="content">
        <div class="element" >
 
 
 
        </div>
</div>
 
<div class="content">
        <div class="element" >
 
 
 
  </div>
</div>

Je souhaite que la hauteur div de classe element puisse dépasser par dessus le div de classe content suivant.

J'ai écrit le css suivant avec les couleur affreuses qui servent de repère visuel...

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
.content {
	background-color: #F00;
	height: 300px;
	width: 300px;
	border: 10px dashed #FF0;
	z-index: 1;
	position: relative;
}
.element {
	width: 100px;
	background-color: #0F0;
	border: 1px solid #000;
	height: 500px;
	z-index: 999;
	display: block;
	position: relative;
}

J'ai essayé de fouiller toute les propriété css qui me semblait pouvoir être utiles.
Et là j'aurais vraiment besoin qu'on m'explique si ce que je veut faire est possible

Merci d'avoir pris le temps de me lire

[Ceddoc]

En mettant un z-index de 0 au deuxième conteneur content?

[Candygirl]

Hello,

En principe, un simple position relative sur .element devrait suffire:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
.content {
	background-color: #F00;
	height: 300px;
	width: 300px;
	border: 10px dashed #FF0;
}
.element {
	width: 100px;
	background-color: #0F0;
	border: 1px solid #000;
	height: 500px;
	position: relative;
}