The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Fade in Captions showing hover state below on mouse out Reply To: Fade in Captions showing hover state below on mouse out

Chris Coyier

Seems OK to me at the moment. Did you figure it out?

There is some layout stuff in there that I probably would have approached differently. For instance, each of those figure.cap-bot is 208px wide, but that’s never explicitly set as best I can tell. They are just that wide because they are floated to the left and the image inside them happens to be 208px wide naturally. That might cause weird layout stuff as the images load in. I’d probably just be explicit with the width there (like you are with the height).

Then when you absolutely position that figcaption inside it, you can set both width and height to be 100% so it sizes with the whole area as needed. No need to maintain those sizes in two places.

And just as a small design critique, I’d probably speed up those transitions a bit. Feels a little slow to reveal text I might actually want to read. And the red link text is a bit hard to read on the darkened photos.