Scrollbar sur un bloc fluide imbriqué

Bonjour,

Je crée un site avec un design fluide, tant en hauteur qu'en largeur. L'image du fond s'adapte à la taille de l'écran :

#container {
	position:relative; /* needed for footer positioning*/
	height:auto !important;
	min-height:100%;
}
#index{
	background:url('img/index.jpg') left top no-repeat;
	background-size:100% auto;
	background-size:cover;
}

Jusqu'ici tout va bien.

Pour le contenu, j'ai un bloc fluide qui s'adapte à la hauteur de l'écran :

article {
	position:absolute;
	bottom:10%;
	max-height:70%;
	overflow-y:auto;
}

Pour l'instant, ça marche : le bloc s'adapte parfaitement à la hauteur du contenu, sans jamais occuper tout l'écran : lorsque le contenu dépasse 70% de la hauteur d'écran, je passe en mode scrollbar. C'est nickel !

Dans ce bloc <article>, il y a un <h1> et un <section>. Or, je voudrais avoir la scrollbar uniquement dans le <section> (et non pas dans l'ensemble du bloc <article>).

Là, je bloque complètement. J'ai essayé de mettre le "overflow-y:auto;" dans le <section>, mais ça ne marche pas : aucun scrollbar n'apparait, le bloc <article> déborde en deça du "container". Je patauge vraiment…

Avez-vous des pistes ou, mieux, une solution ?

Par avance, merci à la communauté !

etnetn
Modifié par etnetn (11 Nov 2012 - 18:51)