Angled divs adding horizontal scrollbar

I’m trying to add horizontal bottoms and tops to my divs. I figured out a way to do it with borders but now the border is so wide across the page that it adds a horizontal scrollbar.


I’ve tried setting overflow: hidden onto the div with the borders, and containing divs but it just causes the div to disappear. Is there a way to keep the angled divs without adding the horizontal scrollbar, where it simply clips at the right edge of the screen?

Here is my site Read-Only: ** **

Hey Joe! You could add a rotated div block like seen on this example:

You may have to play with margins a bit, but let me know if that works for you!

@parker example is the way to go - your method is not making the full screen tilt - as you can see it stops short of the left side of the screen.

This is what I needed! I’d never even used the Section Container before but placing the rotated div inside of that allowed me to set the overflow to hidden to chop off what was going off screen combined with the rotated div. I just need to fudge around with the margins a bit more but it looks like this is what I needed. Thank you so much!

1 Like

Nice! I love using section containers. Sometimes you just have to get the nesting done properly. Glad you got it working!