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

CSS

Posted by fisnik poroshtica
fisnik poroshtica
14,154 Points

What i did Wrong here?

https://w.trhou.se/0n20yb87n8 in this work space what i did wrong, why when i hover over picture the overlay div makes an unwanted effect,

1 Answer

Steven Parker
Steven Parker
243,632 Points
Steven Parker
Steven Parker
243,632 Points

You didn't explain what the page appearance should be, but here's what I see now:

  • you used absolute positioning to place two div's in the same place.
  • one div has an image that appears on top due to a higher z-index
  • the hidden element is mostly opaque black with white lettering
  • you used a 3-D transition to "tip" the image on hover.
  • because of your transform-origin, part of the image tips back behind the other element

So while the effect seems a bit odd, it looks exactly as I would expect based on the CSS used.

:point_right: So what did you WANT it to do?

fisnik poroshtica
fisnik poroshtica
14,154 Points

i want the black div to be BACK part of the photo when i hover in the photo