when height/width is set to 100%, the element sticks out just barely
When I set the height and width of, say, a
canvas to 100%, instead of expanding to fill the screen, it expands past the screen just barely so that a scroll bar appears and I can scroll up/down left/right a few pixels even when I set
left to 0em.
Is there some reason for this? And is there a way to fix this other than setting the height and width, to, say, 98% instead of 100%?
I am using Chrome 36.0.1985.143
It’s because of the
A height of
100% - thus the scrollbar appears.
You could use
box-sizing: border-box to include the border in the element’s width calculation.
border-box: The width and height properties include the padding and border, but not the margin. This is the box model used by Internet Explorer when the document is in Quirks mode.