Help with snap scroll

I'm currently working on my on-line portfolio, and I've reached the limit of my css skills and knowledge. I have a portfolio page on the site I'm designing, and I've gotten the snap scroll to work great. But I'm not sure how to handle the overflow if the text is too long. I'm setting the element containing the write-up and a slide show to 70vh, so if there's any overflow, if I don't hide it, it overlays the item below it. Does anyone have any suggestions on how to deal with it, or do I just need to be brief in the write-ups? Thanks in advance!
4 Replies
Chris Bolson
Chris Bolson3mo ago
Can you set a min-height: 70vh rather than a fixed height? That would allow the container to adapt to the height of it's content. If you do need a fixed height, you may need to look at how to add a vertical scroll to your elements. It might be best if you shared your code, either the working URL or a codepen/jsfiddle slimmed down version just showing the issue.
Dave W
Dave WOP3mo ago
Hmmm, I like the min-height idea, but I'd have to move the arrow indicating that there's more content. That could work. I never thought of that. This is why I need to talk with other devs. I got stuck in a mindset on this. Thanks @Chris Bolson! I do have a staging server setup, the url to the portfolio is https://stg.triple-g.casa/portfolio
Sorya
Sorya3mo ago
i think you should add some transition in hover
Dave W
Dave WOP3mo ago
Could please explain? I'm still learning the fancy stuff @Chris Bolson I may have to give up on the snap scroll. Setting min-height kind of worked, but when you got near the end of the long description, it snapped to the next one. If I leave it as height: 70vh; and set overflow-y to either auto or scroll, I get a second scroll bar to the left of the page scroll bar, and that's sub-optimal as well. Any other suggestions?

Did you find this page helpful?