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?
The whole height. I have changed my design to include more on the homepage to help cover that gap.
Before that, this is what it looked like on my iPhone.
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:
Great Ill give that try, thank you!