Adaptation d'un bloc à la hauteur de la page

Bonjour,

J'exposerai mon problème après ces quelques précisions : design fixe, centré, menu principal à gauche, footer sur toute la largeur de la page (760px).

Mon problème : je souhaiterai que le container du menu principal "s'étire" jusqu'au footer (en fonction donc de la hauteur de la page).

J'ai bien tenté height: 100% (?) sans résultat !

html

<div id="menuprincipal">
<div class="menvcontainer">
<ul class="navlist">
<li><a href="index.html">Accueil</a></li>
<li><a href="presentation.html">Pr&eacute;sentation</a></li>
<li><a href="fonctionnement.html">Fonctionnement</a></li>
<li><a href="sessad.html">S.E.S.S.A.D.</a></li>
<li><a href="index.html">Projets</a></li>
<li><a href="pagenfants.html">La
page des enfants</a></li>
<li><a href="index.html">T&eacute;l&eacute;chargements</a></li>
<li><a href="documents.html">Documents</a></li>
<li><a href="index.html">Contacts</a></li>
<li><a href="index.html">Liens</a></li>
</ul>
</div>
<br />
<div class="menvcontainer">
<ul class="navlist">
<li><a id="topmenu" href="index.html">valid
xhtml strict</a></li>
<li><a href="index.html">valid css</a></li>
</ul>
</div>
</div>

css

#menuprincipal
{
position: absolute;
width: 172px;
height: 100%;
overflow: auto;
font-size: 80%;
background-color: #3399FF;
}

.menvcontainer
{
width: 172px;
}

.menvcontainer ul
{
margin-left: 0;
margin-top: 0;
padding-left: 0;
list-style-type: none;
}

.menvcontainer a
{
display: block;
padding: 3px 15px;
width: 141px;
background-color: #3399FF;
border-bottom: 1px dotted #0066FF;
}

.menvcontainer a:link, .navlist a:visited
{
color: #EEE;
text-decoration: none;
}

.menvcontainer a:hover
{
background-color: #0066FF;
color: #fff;
}

#topmenu
{
border-top: 1px dotted #0066FF;
}


Merci pour votre soutien

Salut! tape "les colonnes factices" sous gougeul et visite pompage.net

Bonjour,

L'article de Pompage répond à mes besoins. Yapluqua ! Merci