Question of the day: box-sizing: border-box?

luhan
Member
Ingresó:
2024-06-24 14:48:13

Image preview

Image preview

What does`box-sizing: border-box` do?

a. Padding and border are included in the element's total width and height

b. Only padding is included in the element's total width and height

c. Only border is included in the element's total width and height

d. Margin, padding, and border are included in the element's total width and height

jenny
Member
Ingresó: 2025-08-24 15:11:06
2024-06-25 07:47:06
["Question of the day","Question of the day: box-sizing: border-box?"]
jenny
Member
Ingresó: 2025-08-24 15:11:06
2024-06-25 09:56:57

Margin, padding are beginners night-mares, it will be good if we can have graphical representation for these things! Cant wrap my head around this one o!

luhan
Member
Ingresó:
2024-06-25 10:06:03

@"jenny"#p485 I know right. It's quite hard to fully understand as a beginner. The box model in Google Chrome developer tools will help in visualizing it. I used it a lot to fully understand margin and padding. Infact I still use it on some occasions.

Facebook X (Twitter) Instagram LinkedIn Telegram WhatsApp