Bonjour à tous,

J'essaye de développer un site qui prend toute la largeur de la page. J'ai plusieurs divs en 100% dans lesquelles je dois mettre des paddings, or quand je les mets ça me décale tout à l'intérieur (ce que je veux) mais aussi à l'extérieur comme ceci :

Voici le code :

<div class="div50 all" style="background: red;">Texte</div>
<div class="div50 all" style="background: blue;">Texte</div>

Et le CSS :

body{
   margin:0;
   float: left;
   padding: 0;
   width: 100%;
}

.div50{
   float: left
   width: 50%;
   padding: 2%;
}

Je précise que je ne suis pas un débutant et que j'ai développé plusieurs sites avant sans avoir eu ce bug. Quelqu'un aurait une solution ? Merci de vos réponses

Salut,

La valeur d'un padding ou d'un border s'ajoute à la largeur que tu spécifies à un élément. Donc tes blocs font 54% de la largeur de body, pas 50.

https://blog.goetter.fr/2011/11/30/width-100-tu-es-le-mal/ + https://forum.alsacreations.com/topic-4-69716-1-Bonnecomprehensionbox-sizingbordureswidth.html