Ceci est assez simple.
est ici le code
<html>
<head>
<style type="text/css">
#left {
float: left;
width: 150px;
border: 1px solid black;
background-color: #999;
height: 50px;
}
#right {
float: right;
width: 150px;
border: 1px solid black;
background-color: #999;
height: 50px;
}
#center {
/* margin with 10px margin between the blocks*/
margin: 0 160px;
border: 1px solid black;
height: 50px;
}
</style>
</head>
<body>
<div id="left">Text</div>
<div id="right">Text</div>
<div id="center">Text</div>
</body>
</html>
Je suis en utilisant des flotteurs au lieu de position absolue. L'avantage d'utiliser des flotteurs au-dessus du positionnement absolu est que vous pouvez placer un autre div en dessous, disons le pied de page. Et donnez-le simplement: les deux et il apparaîtra automatiquement au bas de la page.
est un exemple ici avec un pied de page
<html>
<head>
<style type="text/css">
#left {
float: left;
width: 150px;
border: 1px solid black;
background-color: #999;
height: 50px;
}
#right {
float: right;
width: 150px;
border: 1px solid black;
background-color: #999;
height: 50px;
}
#center {
/* margin with 10px margin between the blocks*/
margin: 0 160px;
border: 1px solid black;
height: 50px;
}
#footer {
clear: both;
margin-top: 10px;
border: 1px solid black;
}
</style>
</head>
<body>
<div id="left">Text</div>
<div id="right">Text</div>
<div id="center">Text</div>
<div id="footer">footer</div>
</body>
</html>
Voila! Vous avez votre disposition liquide.
Au moins jusqu'à ce que vous en ayez marre des flotteurs. Bonne chance. – SamGoody