Adapter la hauteur de la sidebar au content

**BouhLC** · 12/05/2010, 14h54

Bonjour,

Je me permets de poster ici car je cherche la réponse à ma question depuis déjà quelques heures

Je suis en train de développer mon site en local et je bute sur la sidebar dont la longueur ne s'adapte pas à la longueur de l'article, décalant ainsi le footer vers le haut. Voici ce que ça donne :

- En blanc : l'article
- En gris foncé : la sidebar
- En gris clair : le footer

J'ai essayé les colonnes factices, mais en ajoutant l'image en background dans "body", ça me retire le background marron avec les lignes. J'ai dû rater quelque chose à un endroit.

Voici le code CSS de la sidebar :

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
#menu {
	width:310px;
	float:right;
	height:420px;
	background:#CCC9BF;
	}
 
 
.element_menu
{
	width:280px;
	float:left;
	background:#FFFFFF;
	padding:10px;
	margin-top:10px;
	}

J'ai mis une hauteur de 420px en attendant de trouver la solution.

Sauriez-vous quelle modification faire? Merci d'avance !

**12monkeys** · 16/05/2010, 14h40

Bonjour

Pour ton problème de footer qui remonte lis ces deux articles, ils devraient répondre à ta question :

http://css.developpez.com/tutoriels/...issement-flux/ et http://css4design.developpez.com/tut...flux-partie-2/

Pour les colonnes factices c'est la bonne méthode simplement il ne faut pas attribuer l'arrière-plan de ces colonnes factices à body mais à un div englobant ton sidebar et ton article...

**BouhLC** · 17/05/2010, 17h02

Merci pour votre réponse, j'ai pu lire des articles que je n'avais pas vu lors de mes premières recherches.

J'ai réussi à fixer le footer en ajoutant

Code :

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

	clear: both;

En revanche, j'ai toujours ce problème de taille de sidebar. J'ai essayé et réessayé tout ce que j'ai trouvé sur la question : spacer, hr, colonnes factices... Des points au delà de mes compétences en CSS qui sont basiques.

Je pense que je place mal le code dans ma sidebar, parce que ça marche partout sauf chez moi :/

Mes limites se font ressentir

**12monkeys** · 17/05/2010, 19h43

Il faudrait nous montrer ton code CSS et HTML ou, mieux, une page en ligne pour ton problème de fond...

Schématiquement ça devrait faire ainsi :

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
12
<body>
  <div style="background:grey;">
    <div id="corps">
 
    </div>
 
    <div id="sidebar" style="background:grey;">
 
    </div>
  </div>
 
</body>