Aller au contenu

Comment redonner toute la largeur au contenu quand une colonne disparaît ?


vincedo

Sujets conseillés

Hello,

Prenons la mise en page suivante sur 2 colonnes :

#content {
float: left;
width: 66%;
}
#sidebar {
margin-left: 70%;
background: #999;
}

<div id="content">
..
</div>

<div id="sidebar">
..
</div>

Mon problème : quand ma colonne #sidebar est vide (ça arrive), je veux la faire disparaître. Or, j'arrive bien à faire disparaître le <div id="sidebar">...</div> du XHTML, mais comment faire pour que le contenu (#content) occupe alors toute la largeur de la page ?

Ma CSS n'est pas générée dynamiquement (contrairement à la colonne #sidebar), je ne peux donc pas changer la propriété "width" à la volée. Résultat : je me retrouve à faire des mises en page en tableau et c'est bien dommage... comment l'éviter ?

Je pourrais changer mon markup pour :

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

et floater uniquement la sidebar, mais si le contenu est plus long qu'elle, elle ne descendra pas jusqu'en bas...

Modifié par vincedo
Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...