So I am using this as an online portfolio, and Im having trouble with the breakpoints. My homepage is simple, but I’ve noticed that on mobile I have a huge gap. I cannot find a work around for this.
Can you point out which area you’re having trouble with? I’m looking at your site and nothing jumps out as having an excessively large gap on mobile. Maybe the space below the header?
Without any content within your main div block, the block won’t extend to the full height of your browser window. To get around this, you can set min-height: 100vh to ensure that it’s at least the height of the viewport.
Given your footer element is acting as a quick access bar for icon links, it may be useful to set this element to position: fixed and select a bottom position so that it is always visible as you scroll: