28172 sujets

CSS et mise en forme, CSS3

Problème de contours

Bonjour tout le monde,

je voulais créer une page avec des contours ( en haut et en bas ), mais ca tourne mal, et je sais pas vraiment quoi modifier sur mon fichier css pour que ça marche, si quelqu'un parmi vous peut m'aider SVP

Code XHTML:

<div id="body">
<div id="top"></div>
<div id="content">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas id enim nunc, eget commodo dui. Etiam libero nunc, imperdiet non pretium vel, egestas quis ligula. Quisque rutrum quam et elit lobortis pretium. Integer sem enim, interdum quis dignissim ut, faucibus quis turpis. Nullam at quam vel eros suscipit pulvinar id ut nunc. Phasellus pretium rhoncus libero a suscipit. Nunc vestibulum imperdiet risus, et egestas lectus ullamcorper eu. Etiam euismod libero vitae dolor eleifend adipiscing. Vivamus eu lacinia odio. Fusce bibendum leo non lacus ornare lobortis. In mattis rhoncus ante et porttitor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Praesent sit amet dapibus lorem. Nunc erat massa, mattis vel tincidunt id, tristique laoreet mi. Maecenas porta metus vitae ligula malesuada varius. Etiam tincidunt mattis tincidunt. Sed tortor metus, rutrum viverra auctor malesuada, tristique vel velit. Vestibulum lacus dolor, sollicitudin ut volutpat quis, pulvinar et lectus. Integer vitae blandit tellus. Nulla facilisi.</p>
<p>Duis diam dolor, mattis ut mollis sed, vulputate vitae quam. Nam cursus dui quis urna placerat convallis. Sed non ligula nibh. Maecenas egestas faucibus eros, ultrices ornare erat suscipit quis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam tempus nisi ac lectus volutpat accumsan. Nullam auctor rhoncus nulla, a lobortis justo scelerisque in. Morbi sodales facilisis eleifend. Etiam vehicula tincidunt nulla ac sagittis. Nulla vel mi purus, et mattis orci.</p>
</div>
<div id="bottom"></div>
</div>


Code CSS:

body {
background: #f5f5f5;
}

#top {
margin: 0;
background: url(../img/box-top.jpg) no-repeat;
height: 15px;
width: 950px;
}

#content {
margin: 0;
width: 950px;
background: url(../img/box-content.jpg) repeat-y;
}

#bottom {
background: url(../img/box-bottom.jpg) no-repeat;
height: 15px;
width: 950px;
margin: 0;
}

#content p {
padding: 0 30px 0 30px;
}


le résultat est içi :
http://img259.imageshack.us/img259/5858/tmp.jpg

Je désire enlever ces éspaces!
Modifié par Florent V. (11 May 2009 - 19:03)
merci pour la réponse Smiley smile

sinon pour la solution que tu viens de proposer ( définir le padding ), j'ai déjà testé ça, mais ca n'a rien changé, au fait j'ai mit (dans le bloc #content biensur):

padding-top: 0;
padding-bottom: 0;

mais comme j'ai dit, ça change rien Smiley decu
xb414 a écrit :
merci pour la réponse Smiley smile

sinon pour la solution que tu viens de proposer ( définir le padding ), j'ai déjà testé ça, mais ca n'a rien changé, au fait j'ai mit (dans le bloc #content biensur):

padding-top: 0;
padding-bottom: 0;

mais comme j'ai dit, ça change rien Smiley decu
Ben oui : je parlais de mettre une valeur différente de celle par défaut pour un DIV (0).

Quelque chose comme padding: 3px 0;
xb414 a écrit :
sinon pour la solution que tu viens de proposer ( définir le padding ), j'ai déjà testé ça, mais ca n'a rien changé

Avant de te précipiter sur le code, tu as bien entendu lu attentivement l'article qu'Heyoan avait indiqué?
oui, j'ai lu l'intégralité de cet article, mais je trouve toujours pas une solution pour mon problème...
Sujet clos
Aller à