WebDev
KPCKevin Powell - Community
•Created by peterpumkineaterr on 4/13/2024 in #front-end
this scrolling won't stop.
I suggest you do a side-by-side compare of your pen and mine.
36 replies
KPCKevin Powell - Community
•Created by peterpumkineaterr on 4/13/2024 in #front-end
this scrolling won't stop.
@That's what she said! I simplified the layout a bit - header, container and footer. Note my version has the elements that I thought were "extra" removed, so those would need to be added back if you choose to use them.
If you are from a design background you may have an easier time using a tool like Webflow which more or less allows you to design w/o having to worry so much about the underlying CSS.
36 replies
KPCKevin Powell - Community
•Created by peterpumkineaterr on 4/13/2024 in #front-end
this scrolling won't stop.
Haha gotcha - all good 🙂
36 replies
KPCKevin Powell - Community
•Created by peterpumkineaterr on 4/13/2024 in #front-end
this scrolling won't stop.
Here's an updated/simplified version: https://codepen.io/badg0003/pen/QWPBOXX?editors=1100
36 replies
KPCKevin Powell - Community
•Created by peterpumkineaterr on 4/13/2024 in #front-end
this scrolling won't stop.
@That's what she said! Gotta be honest I feel you're kinda overcomplicating this with the extra "Berry" and "Coming soon". You already have "Berry" presented on the page, vertically and you have a title that conveys the message that this content/site is coming soon, so I'm not sure why you feel you need to repeat both elements.
36 replies
KPCKevin Powell - Community
•Created by peterpumkineaterr on 4/13/2024 in #front-end
this scrolling won't stop.
True, although so long as you have the proper 'guardrails' in place via
clamp , min, etc, there isn't a problem. Plus in this case, we're talking about a logo/wordmark so not exactly a deal-breaker if its a bit smaller on some displays.36 replies
KPCKevin Powell - Community
•Created by peterpumkineaterr on 4/13/2024 in #front-end
this scrolling won't stop.
Also, I should add if you want to avoid a vertical scrollbar on smaller devices, you could always switch your font size to use viewport units
36 replies
KPCKevin Powell - Community
•Created by peterpumkineaterr on 4/13/2024 in #front-end
this scrolling won't stop.
Updated pen: https://codepen.io/badg0003/pen/poBZRGz?editors=1100
36 replies
KPCKevin Powell - Community
•Created by peterpumkineaterr on 4/13/2024 in #front-end
this scrolling won't stop.
@That's what she said! I've made a few adjustments and this should now work more or less the way you were looking for. Essentially the
height: 100vh was causing most of the issues as this was being applied to the sibling instead of body. Another change I made was to make this non-absolute positioned and swapped to a vertical writing mode. A few adjustments are needed, likely, but that should get you started.36 replies