28172 sujets

CSS et mise en forme, CSS3

[Résolu] Contenu en deux parties égales scrollable

Bonjour à tous et meilleurs vœux,

J'ai fait de nombreux essais et je n'arrive pas à obtenir le patron (template) suivant :

- une entête et un pied de page fixes de 10% de hauteur chacun
- un contenu en deux parties égales de 30% dans un conteneur (donc à 60% de la largeur)
- les deux contenus ne passent jamais au-dessus de l'entête et du pied de page et sont scrollable si plus grands que 80% de la hauteur

Merci beaucoup à celle ou à celui qui aura le courage de me répondre.

Rudy.
Si tu défini la hauteur du header et du footer en pourcentage, cela signifie qu'elle dépendra de la taille de la fenêtre du navigateur, je ne sais pas si c'est ce que tu désire mais je ne pense pas que ça soit la meilleure option: tu devrais plutôt leur attribuer une hauteur fixe. Sinon, ce que tu décris correspond à ceci (ne pas tenir compte du design Smiley langue ) ? :
<html>
	<head>
		<style>
			body {
				margin:0;
			}
			
			.header, .footer {
				background:blue;
				height:10%;
				width:100%;
			}
			.content {
				background:red;
				height:80%;
				width:60%;
				left:50%;
				margin:0 0 0 -30%;
				position:relative;
			}
			
			.content .left, .content .right {
				height:100%;
				width:49%;
				overflow:scroll;
			}

			.content .left {
				float:left;
			}

			.content .right {
				float:right;
			}
		</style>
</head>
	<body>
		<div class="header"></div>
		<div class="content">
			<div class="left">
			</div>
			<div class="right">
			</div>
		</div>
		<div class="footer"></div>
	</body>
</html>

Modifié par xXjujo002Xx (16 Jan 2013 - 12:15)
Un grand merci à toi, c'est exactement ce que je souhaitais.
Personnellement j'aime les pourcentages (lorsqu'ils sont respectés par tous les navigateurs).

Je ne suis pas web designer mais je fais une application en java EE.

Le design et la fluidité d'un site sont des fondamentaux.

Bon courage à tous.

Rudy.
Sujet clos
Aller à