This width included the size of the content and padding and border, as well as the vertical scroll-bar if present. But not the margin of the element.
- We say “viewable” width of an element. That means if the target element has a fixed width but there was an overflow of content, then the width would be only the value set for the `width` property (which is the visible width of the element) + the size of the padding and border.
- Check the CSS Box Model section if you’re not familiar with it.
The offsetWidth property is read-only and so we can’t assign a value to it.
The return value of this property, as mentioned before, is the viewable width of the element.
Here the width of the <ol> element is set to 100px, the padding is set to 20px and the border to 10px.
So that’s how the offsetWidth returned the value 160px:
100px + 20px + 20px + 10px + 10px = 160px