Discussion :

[Amerzone38]

Bonjour,

J'ai deux DIV cote à cote de 512 de large, englobés par un DIV de 1024. Quand je mets du Padding sur un de mes deux DIV il me l'agrandit, pourquoi ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
 
.accueil  {
          clear: both;}
 
.accueil_logo  {
               text-align:center;
               border:none;
               width:512px;
               padding-top:60px;
               float:left;
               }
 
.corps    {
          font-family:"verdana";
          color:#5b5656;
          font-style:italic;
          width:512px;
          border:none;
          padding-top:60px;
          float:left;
          padding-right:20px; /*c'est ce padding qui gene*/
          }  
 
.travaux  {
          text-align:center;
          border:none;
          width:1024px;
          clear: both;
          padding-top:60px;
          }
 
h3   {
     font-family:"verdana";
     font-size:1.5em;
     }

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
     <div class="accueil">
          <div class="accueil_logo">
               <img src="img/tableauaccueil.png" alt=""/>
          </div>
          <div class="corps">
               <h3>Lorem ipsus</h3>
          </div>
     </div>

Merci pour vos reponses

[sebhm]

Bonjour,

c'est tout à fait normal
(bien que nos vieux amis IE < 6 ne l'entendaient pas ainsi : c'était le fameux mode Quirks)

si tu as une boite :
- width = 200px
- padding = 10px
- border = 1px
- margin = 20px

la largeur de ta boite est : 200 + 10*2 + 1*2 + 20*2 = 262 px

(et non pas 138px + tout le reste qui te ramenerait à 200px)

[Bisûnûrs]

Parce que c'est normal.
Cf : http://j-willette.developpez.com/tut...ge=page_1#LI-C
Il te faut juste réduire la largeur de ton élément pour qu'il prenne en compte la taille du padding.

[Amerzone38]

Merci pour vos reponses