Bonjour,
Je me permets de poser ma question car ça fait plusieurs heures que je sèche sur le problème. Je souhaite mettre un div dans un autre. Jusque-la rien de compliqué. Alors j'ai écrit le code CSS et HTML suivant :
Code :
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
- <title>Index</title>
- <link href="./aux/style.css" rel="stylesheet" type="text/css" />
- </head>
- <body>
- <div id="containeur">
- <div id="left">
- <p>Test 1</p>
- <p>Test 2</p>
- </div>
- </div>
- </body>
- </html>
|
Code :
- @charset "UTF-8";
- * {
- font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
- }
- h1 {
- font-size:14px;
- color:rgb(0, 102, 153);
- padding: 3px;
- margin-top: 0px;
- margin-bottom: 3px;
- }
- p {
- font-size: 12px;
- font-family: Verdana;
- white-space: normal;
- display: block;
- padding: 3px;
- margin-bottom: 9px;
- margin-top: 0px;
- }
- body {
- background-color: #ece4d9;
- background-repeat: repeat-x;
- display: block;
- }
- #containeur {
- width: 952px;
- margin-top: 30px;
- margin-right: auto;
- margin-left: auto;
- background-color: #FF0000;
- clear: both;
- float: none;
- padding: 12px;
- }
- #left {
- width: 580px;
- margin-top: 20px;
- margin-left: 0px;
- float: left;
- text-decoration: none;
- height: auto;
- overflow: visible;
- clear: left;
- }
|
Le problème c'est qu'en l'état le div left n'est visuellement pas dans le div containeur. Si je supprime la propriété float de left, alors tout est ok. Le hic c'est que j'ai besoin de cette propriété car je souhaite insérer, au final, deux div dans le div containeur (afin d'avoir deux colonnes). Comment faire alors ?
Merci de votre aide.
---------------
Un être en tant qu'être ne pourrait-il pas être autre qu'il n'est s'il n'explique pas lui-même son être ?