Can't count the total width of an html element with CSS box model

1

https://www.w3schools.com/css/tryit.asp?filename=trycss_boxmodel_width

I’ve read that the total width should include the padding, border and margin, so according to , shouldn’t the

element in this exercise has a total width of 335 instead of 350?

Also, this exercise didn’t set the value of padding etc, do pictures have no properties of padding, border, and margin? or is it the case that without setting, these properties just fall back to the default of 0px?

Thanks for helping in advance!

2

sorry about the first paragraph. The sentence is " so according to the style sheet, shouldn’t the div element has a total width of …"

3

This is the styling of the div:

    width: 320px;
    padding: 10px;
    border: 5px solid gray;
    margin: 0;

When you you calculate the width of the item you have to keep in mind that the padding and the border values when written like this are added to all four sides. So there is 10px padding left but also on the right side.

1 Like