28173 sujets

CSS et mise en forme, CSS3

[Résolu] - [CSS] 2 colonnes, coup classique ;-)

Bonjour,

coup classique un menu et un contenu, un footer pour tirer le tout vers le bas mais ça foire. Ca se voit bien au niveau des couleurs que j'ai mis pour tester, le menu de gauche ne descend pas en bas : 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>test</title>

<style type="text/css">
<!--
body {
	margin-top:0px;
}

#general {
width:950px;
margin:auto;
}
#gauche {
    float:left;
    background-color:#00FF00;
	width:250px;
	border:solid #ccc 5px;
}
#droite {
	float:right;
	width:690px;
	background-color:#0033FF;
}

#copyright { 
	clear:both;
	background-color:#ccc;
	text-align:center;
}

-->
</style>
</head>
<body>
<div id="general">
	<div id="gauche">div gauche</div> <!-- gauche -->
	
	<div id="droite">
					<p>div droit
						<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
						<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
						<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
						<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
					</p>					
	</div> <!-- droite -->

	<div id="copyright">Reproduction interdite, meme partielle - 2007</div></div>
</body></html>


merci d'avance Smiley smile
Modifié par xhark (12 Jun 2007 - 22:13)
Salut,
Perso je trouverais sympa si tu pourrai mettre un lien online pour qu'on puisse voir...c'est plus simple Smiley cligne

J'ai quand même un peu regardé ton code. J'ai une piste :

design complet en 2 colonnes Smiley cligne

Voili voilà
Modifié par climax (12 Jun 2007 - 20:04)
J'ai déja consulté ce lien en fait. Ce qui diffère c'est que le corps et le menu ont le même fond (blanc), donc ça ne se voit pas. Mais si tu regardes avec webdevelopper tu vois que le div de droite (sidebar) ne descend pas tout en bas.

Voici une version en ligne : http://xhark.olympe-network.com/alsa.html

Et voici l'aperçu directement :
upload/7560-test.png
Salut.

Ce problème se résoud à l'aide des colonnes factices. Une petite recherche sur la FAQ, ou sur le forum devrait rapidement résoudre ton problème.
xhark a écrit :
merci de votre aide je vois qu'il faut bidouiller Smiley decu

Ce n'est pas de la bidouille, mais du trompe-l'oeil. La différence, c'est la fiabilité. Ne nous trompons pas sur les termes. Smiley cligne

xhark a écrit :
j'espère que le CSS3 arrangera tout ça

CSS 2 a déjà arrangé ça. Ça s'appelle display:table-cell. Seul Internet Explorer est à la traine pour l'implémenter. Il faut donc dire : « j'espère qu'IE 8 arrangera tout ça » (à noter pour être juste qu'IE n'est pas le seul à avoir des lacunes dans l'implémentation des CSS 2.1... tous les navigateurs en ont).
Sujet clos
Aller à