orang | Bonjour,
Je cherche à réaliser une page dont la structure serait identique à celle là : http://openweb.eu.org/IMG/article52/annexe3.html
Pour ce faire, j'ai repris le code :
HTML
Code :
- <body>
- <div class="chapi" id="milieu">
- <div class="chapi" id="colonne"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin eleifend dui eu sem. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Praesent dictum tortor quis nulla. Donec magna orci, porttitor sed, eleifend vitae, vestibulum facilisis, mauris. Morbi eu augue. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Morbi quis erat. Integer pretium augue id diam. Donec euismod lobortis diam. Nam eros quam, vehicula id, luctus a, tempor quis, dolor. Nam purus eros, congue id, vehicula quis, gravida at, ligula. Suspendisse potenti. Etiam velit. Cras condimentum mi ac magna. Nunc dui quam, dignissim aliquam, vehicula nec, ultricies non, tortor. Sed vitae justo. Suspendisse dignissim euismod est. Aliquam </div>
- <div class="chapi" id="colonne"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin eleifend dui eu sem. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Praesent dictum tortor quis nulla. Donec magna orci, porttitor sed, eleifend vitae, vestibulum facilisis, mauris. Morbi eu augue. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Morbi quis erat. Integer pretium augue id diam. Donec euismod lobortis diam. Nam eros quam, vehicula id, luctus a, tempor quis, dolor. Nam purus eros, congue id, vehicula quis, gravida at, ligula. Suspendisse potenti. Etiam velit. Cras condimentum mi ac magna. Nunc dui quam, dignissim aliquam, vehicula nec, ultricies non, tortor. Sed vitae justo. Suspendisse dignissim euismod est. Aliquam </div>
- <div class="chapi" id="colonne"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin eleifend dui eu sem. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Praesent dictum tortor quis nulla. Donec magna orci, porttitor sed, eleifend vitae, vestibulum facilisis, mauris. Morbi eu augue. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Morbi quis erat. Integer pretium augue id diam. Donec euismod lobortis diam. Nam eros quam, vehicula id, luctus a, tempor quis, dolor. Nam purus eros, congue id, vehicula quis, gravida at, ligula. Suspendisse potenti. Etiam velit. Cras condimentum mi ac magna. Nunc dui quam, dignissim aliquam, vehicula nec, ultricies non, tortor. Sed vitae justo. Suspendisse dignissim euismod est. Aliquam </div>
- </div>
- </body>
|
CSS :
Code :
- Body {
- background-image: url(../Images/Fond/nappe.jpg);
- }
- .chapi#milieu {
- background-color: #FFFFFF;
- width: 780px;
- margin: 0;
- padding: 0;
- }
- .chapi#contcentral {
- background-color:#00CC33
- }
- .chapi#colonne {
- float: left;
- width: 25%;
- margin: 1em 0
- }
|
Mais cela ne fonctionne pas : les 3 colonnes n'entrent pas dans la div class="chapi" id="milieu"> et semblent les unes sur les autres
Il existerait un moyen de corriger cela proprement ?
Par ailleurs, est-il possible de centrer ces div au sein de la Div ?
par avance, merci ![:) :)](https://forum-images.hardware.fr/icones/smile.gif) Message édité par orang le 27-11-2010 à 14:35:54
|