Claudio Yanes
2022-03-04 dc9b421e21d02e9d247d1640cb518c416a5dcbab
refs
author Claudio Yanes <me@claudio4.com>
Friday, March 4, 2022 04:12 +0000
committer Claudio Yanes <me@claudio4.com>
Friday, March 4, 2022 04:12 +0000
commitdc9b421e21d02e9d247d1640cb518c416a5dcbab
tree b474c970d701cd173b656d0f2fb7c25276810624 tree | zip | gz
parent 8779e72c77c2e454d444b86d3d5ebda9bfab46d7 view | diff
Remove unnecessary scrollbars

The margin property can escape the parent node and move it alongside
its child. This happens with singlePage div and the body, resulting in
scrollbars appearing as the body has the size of the viewport but
does not align with it. This phenomenon can be always observed
in the vertical axis and it can also be observed in the horizontal axis
when the viewport it’s not wide enough (mostly in mobile).

Using paddings prevents this “extra space” from scraping and displacing
the body.

Also, the value 100vw does not take into account the space taken by the
vertical scrollbar, thus making the body wider than the actual viewport,
producing a horizontal scrollbar.
1 files modified
8 ■■■■■ changed files
assets/styles/base.scss 8 ●●●●● diff | view | raw | blame | history