Blockquote style causes overflow on x-axis
Closed this issue · 4 comments
Your Blockquote component from the design-system has width:100vw, causing overflow on pages that have height bigger than 100vh.
Blockquote style
Yeah there's sadly no straightforward solution to this, kind of a bummer. I'll try to see if I can remove the 100vw and rely on grid-column instead, but with my current layout that's not a solution I think
Best I could do for now would be to hide horizontal scrolling on the blog itself
The way i fixed this problem in my blog was by adding a calc(100vw-17px) for desktop with tailwind, but it breaks when using a tablet. The more complex solution would be to calculate the scroll-width in an useEffect and then subtract.
took the time to fix this in the design system: https://github.com/MaximeHeckel/design-system