+ 1

Help padding

Padding adds up with width? Does it add up like this? Width: 90%; Padding: 0 10%; Result would be 100%? Is that correct? But another doubt about Padding The padding when set Padding: 10%; Does it give a 10% spacing on all sides? Or does it divide in the four corners?

4th Jan 2019, 3:16 PM
Matheus Batista
Matheus Batista - avatar
6 Réponses
+ 3
Padding will make the element wider. width: 100px; padding: 0 10%; Width of the element will be 120px Use box-sizing: border-box; The width will remain at 100px Padding will be included on the current width.
4th Jan 2019, 6:57 PM
Toni Isotalo
Toni Isotalo - avatar
+ 1
Width in percentage is calculated relative to the parent element. And padding is calculated relatively to the element itself. And padding applies the same padding on each side. So width:90%; padding:10%; sizes the element width to 90% of the parent element and sets padding 10% of element's width on each side of the element.
4th Jan 2019, 6:34 PM
Дмитро Іванов
Дмитро Іванов - avatar
0
Shashi Ranjan there is not talking about the sum
4th Jan 2019, 4:12 PM
Matheus Batista
Matheus Batista - avatar
0
Дмитро Іванов so in case an example if I used width: 90% and padding: 10% total would be 110%? right?
4th Jan 2019, 6:59 PM
Matheus Batista
Matheus Batista - avatar
0
Toni Isotalo I do not want to use box-sizing I know well how it works I want to understand how the sum of them works
4th Jan 2019, 7:01 PM
Matheus Batista
Matheus Batista - avatar
- 1
4th Jan 2019, 3:30 PM
Шащи Ранжан
Шащи Ранжан - avatar