Height ou Padding ?

Bonsoir,

Je commence à apprendre le CSS mais j'ai dû mal parfois à différencier certaines propriétés. Par exemple, je ne vois pas trop la différence entre un height ou un padding?

Par exemple, dans un topbar j'utiliserai plutôt un padding à la place d'un height mais le résultat demeure pourtant identique. :weird:

1er solution:

Code:

---

1 2 3 4 5 6 7

.topbar-logo { display: block; text-align: left; font-size: 24px; padding: 11px 11px; }

---

2ème solution:

Code:

---

1 2 3 4 5 6 7 8 9

.topbar-logo { display: block; text-align: left; font-size: 24px; height: 50px; padding-top: 15px; padding-left: 20px; }

---

Est-ce que pour vous la solution n°2 est une erreur?

Bonjour,

• Glossaire des propriétés CSS
• padding
• margin
• border
• height
• ...

Bonjour,

Merci pour les liens, j'avais déjà jeté un coup d'oeil dans la doc mais je trouve que c'est pas trop clair.

Padding : Permet de définir l’espacement interne d’un élément
Height : Permet de définir la hauteur d’un élément

Je n’arrive toujours pas à différencier les deux propriétés, pour moi elles font la même chose. D’habitude, j’utilisai un height pour une topbar mais dans certains tutoriels sur youtube on utilise plutôt un padding.

Code:

---

1 2	<div id="test1">Hello</div> <div id="test2">The World</div>

---

Code:

---

1 2 3 4 5 6 7 8 9 10

#test1 { display:inline-block; background:green; height:100px; } #test2 { display:inline-block; background:yellow; padding:100px; }

---

Ça te parait toujours "identique" ?

Merci à toi, j'ai compris maintenant.