All solutions

this was a nice challenge however positioning got in the way. whats a good way to center vertically? i want the two overlapping and i used px to get it but it leads to when on mobile it being on the bottom

Heya guys, biggest part i struggled with was adding the purple layer on top of the image. was there a better way to do this?

the quote placement i feel could be a bit better but i wasnt sure how to get its positioning to be both taken out of the flow (position: absolute) but then keeping its positioning relative to the div container and not the entire page.

comments and feedback are appreciated

Heyo, i was a bit stumped on the background pattern, i wasnt sure if there was some way to get it to scale with the width of the screen as trying to change its width did nothing.

comments and feedback appreciated, thanks!

Hey guys this was my first attempt with learning html/css at this and while i think it went well there were a few parts i struggles with. First, when i added a width to the "you scored higher div" it took it out of the align center and i wasnt sure why that was happening or what a clean fix was. Second, to try and get the right side to be overlapped by the left i was trying to set the z-index of it to -1, however when i did that the button stopped working even when i set the button to z-index of 1. Feedback and comments are most welcome!