Float et Clear: both;

**ThinKiT** · 05/12/2008, 14h01

Hello tout le monde,

Aujourd'hui je travaille activement sur la création d'un thème wordpress et je recontre un gros problème, c'est d'ailleurs pour cela que j'aurais besoin de votre précieuse aide

Voilà un peu comment ça se présente au niveau du code (je l'ai simplifié à mort pour que cela soit plus simple) :

Code HTML :

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
<body>
    <div id="header">
    </div>
    <div id="conteneur">
        <div id="sidebar">
        </div>
        <div id="content">
        </div>
        <div id="footer">
        </div>
    </div>
</body>

Code 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
 
#header {
	background: url(images/fond-header.jpg) repeat-x;
	height: 160px;
}
 
#conteneur {
	position: relative;
}
 
#content {
	margin-right: 460px;
	margin-left: 3%;
	padding: 0 10px 0 10px;
}
 
#sidebar {
	position: absolute;
	right: 3%;
	width: 405px;
	background: url(images/haut_sidebar.png) top no-repeat;
	font-family: Arial, Helvetica, sans-serif;
}
 
#footer {
	clear: both;
	padding: 80px 0 0 0;
	height: 54px;
	background: url(images/fond-footer.jpg) repeat-x;
	text-align: center;
}

Merci de votre aide

**Bisûnûrs** · 05/12/2008, 14h22

Et quel est le problème ?

**ThinKiT** · 05/12/2008, 14h34

Le problème c'est que mon footer varie en haute selon la div contenu mais pas en fonction du contenu ET de la sidebar : si la sidebar est plus le longue que le contenu PLOUF le footer ne se colle pas en dessous mais reste collé au contenu.

Je ne sais pas si j'ai été clair

Pour résumer j'aimerais que mon footer se cale en dessous de ma sidebar si celle-ci est plus grande et en dessous de mon contenu si celui-ci est plus grand

**Bisûnûrs** · 05/12/2008, 14h40

Dans ta sidebar, remplace ton position:absolute et ton right:3% par un float:right;

**ThinKiT** · 05/12/2008, 15h07

Nan mais j'ai vraiment un gros soucis ... Ca marche

Merci et par contre j'ai l'impression que mon z-index ne fonctionne plus sur le float :s Aie

**Erwan31** · 05/12/2008, 18h49

Envoyé par ThinKiT

par contre j'ai l'impression que mon z-index ne fonctionne plus sur le float :s Aie

la propriété z-index ne prend effet que sur les éléments positionnés (absolutre/fixed/relative)

Float et Clear: both;

CSS

Discussions similaires

Partager

Partager