overflow:transparent / overflow with opacity

[MichelleMcG]

I’ve been looking for a way to give overflow some transparency in a responsive layout. So far this is the only method I’ve found, and I haven’t been able to get it to work: http://stackoverflow.com/questions/7701055/transparent-image-mask-on-css-overflow

My specific situation is I have an image that’s going to be positioned via margin-left so it hangs slightly outside of a sidebar, and I’d like the part that hangs outside to have an opacity of .5.

Can anyone think of a better way to do this? Thanks!

Michelle

[Paulie_D]

It’s a little hacky (at least to me)…http://codepen.io/Paulie-D/pen/pIzHl

[Kitty Giraudel]

What @Paulie_D did. With or without pseudo-element though. You could apply the background-image to the div.

[Author]

Posts