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

Slide-Up Boxes Issue

Using some CSS3 animations, I've made three boxes with text that slides up on hover. But I want the images I've got (ESPN, Cracked.com, WSJ) to appear on the hover in those boxes as well...and they're not appearing.

Any ideas?

Codpen: http://cdpn.io/LCarB

Thank you.

4 Answers

Do you have a codepen account? It could just be because your image path doesn't contain any images to use as the background for codepen.

Ah, true. But either way, you could stick an absolute image in there from a website, i still don't think it would show up.

I'm doing that now, and it's not. Im playing with it

It's kinda working in FireFox, it's completely not working in Chrome. In firefox the transition doesn't work, but on hover the an absolute path to a background does show up, but it looks like there is 10px of margin because the background doesn't cover the entire height of the section box.

In Chrome the transitions work but the background image is to the right of the box.

Gotta go, so I can't mess with it more right now, but that's where I'm at.

Had to add -moz-webkit to each transition, but now I'm getting the same thing in Mozilla.