Why is body
not full width, even though its set to 100% / vw?
In a strange way it is full width, but the viewport is scaled down automatically by the browser, so it fits in the overflowing content.
To check, if this is the case, type this in the console (1): window.visualViewport.scale
1) edit Sep. 2019: visualViewport: only available on Chrome - sry for late notice
If it returns something like 0.8, then the body size is correct, but the viewport is scaled down.
You can also double tap to toggle between scale 1 and "fit-content-scale" (needs touch simulation like in chrome dev-tools).
How to not overflow body
?
- See here https://stackoverflow.com/a/14271049/3313410 "Creating a site wrapper div inside the body"
- or check, if a certain element has a
min-width
, that "overrides" its width
- or check, if something is rotated, or margins out https://stackoverflow.com/a/45534745/3313410