Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Josué Rodriguez
Front End Web Development Techdegree Graduate 24,118 PointsHaving trouble with "clip-path" can you help me please?
Greetings After going over the HTML Basics course I wanted to finish the page by adding css and making it like the preview instructor Guil Hernandez shows in the final video. I posted a screenshot here when I asked him about it.
He replied with how he did it but I can't get it to work.
At first it was cutting off everything after it. Then I placed items outside of it but as you can see the person wearing VR goggles gets cut off. How can I make this work like his example?
Here is my code:
https://codepen.io/josuerodriguez/pen/qxOGGJ?editors=1100
Thanks
1 Answer
Steven Parker
243,318 PointsIt's not actually "cut off" but it's being covered.
I added "position: relative;" to the rule for ".splash-msg" to give it a new positioning context and force it to be on top.
Josué Rodriguez
Front End Web Development Techdegree Graduate 24,118 PointsJosué Rodriguez
Front End Web Development Techdegree Graduate 24,118 PointsAh! This works, thanks!
I tried doing z-index with the whole being on top idea but yeah that didn’t work either. I’ll read up on the relative position to see if I can understand it.
Steven Parker
243,318 PointsSteven Parker
243,318 Pointsz-index only applies to things in the same positioning context.