CSS Layout Question

Question

Je ne peux pas pour la vie de moi trouver un moyen de faire ce travail. Si j'ai 3 divs (une barre latérale gauche, un corps principal et un pied de page), comment est-ce que je peux avoir la barre latérale et le corps principal côte à côte sans les positionner comme "absolu" ou les faire flotter? Si vous faites l'une ou l'autre de ces options, le div n'est pas poussé vers le bas par l'un ou l'autre.

Comment pourrais-je accomplir cela indépendamment de ce qui vient avant ces éléments (dire un autre div en tête ou quelque chose)?

Dans le cas où il aide, voici une illustration des deux cas, je suis en train de permettre:

alt text http://www.nickawilliams.com/files/layout.jpg

Voici une version simplifiée du HTML, j'ai actuellement mis en place:

<div id="sidebar"></div> 
<div id="content"></div> 
<div id="footer"></div> 

Answer 1

Vous devez spécifier le pied de page pour effacer le flotteur:

#footer{ 
clear: both; 
} 

Cela le force sous les éléments flottants.

D'autres options pour effacer sont à gauche et à droite.

Answer 2

À l'heure actuelle, vous êtes assez désespéré si vous ne voulez rien faire flotter, ni utiliser la position: absolue.

Les seules alternatives de gauche sont:

• utilisation display: inline-block pour les divs de la barre latérale et le contenu (ce ne sont pas pris en charge par tous les navigateurs encore)
• attente pour le css advanced layout module ou un autre module de colonne (prendra probablement pour toujours)
• Retournons à l'aide de tables

Answer 3

faire une de ces options dans le résultat div bas de page ne pas être poussé vers le bas par l'un ou l'autre ?

Essayez this tool