28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Je cherche à mettre une couleur de fond sur une section. J'aimerais que la couleur prenne toute la largeur et une hauteur définie. La section dispose de texte en 3 colonnes, le tout doit donc êtres responsive.
Pour le moment, ma couleur de fond ne se trouve que sous mon texte.

Mon HTML :
<section id="competences" class="row">

<h3>TITRE</h3>

<br>
<div class="large-4 columns">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo</p>
</div>
<div class="large-4 columns">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo</p>
</div>
<div class="large-4 columns">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo</p>
</div>

</section>

Mon CSS :
#competences {
background-color: #05B99E;
width: 100%;
height: auto;
}

J'ai cherché une solution à mon problème, entre margin et padding mais je n'ai rien trouvé pour le moment, donc si quelqu'un peut m'éclairer..
Merci beaucoup !
Bonjour,

Je t'invite à nous laisser une version consultable en utilisant codepen par exemple.

J'imagien que tes colonnes sont en float:left; et que tu veux que le background s'adapte proprement, tu as deux options :

Soit tu utilise un overflow :
.row{overflow:hidden;}


Soit tu fais un clear :
.row:before,.row:after{content:"";display:table;}
.row:after{clear:both;}


En espérant t'avoir aider, bon courage !