Is it possible to create an arrow on a box both being semi-transparent?

[Artem Gordinsky]

I mean something like this: http://cssarrowplease.com
But I need both the box and the arrow to be semi-transparent, but share one border (like this). Is this even possible?

[Paulie_D]

Absolutely. You just have to swap out the hex colour value for an rgba value.

[Artem Gordinsky]

Thanks!

I’ve tried, but the border of the box becomes visible through the arrow… Am I doing something wrong? Would you help me out, please?

[Paulie_D]

In that case, it would seem I was wrong…it happens.

You might be able to do something with some of the new filter dropshadow properties…but support is pretty limited at the moment.

[Artem Gordinsky]

Thanks anyway!

Do you know any other way to do a semi-transparent box corner? I just can’t find any. Except styling the whole side by an image. I’m struggling with this thing today.

[Paulie_D]

Do you know any other way to do a semi-transparent box corner?

Doubtful.

Do you mean make part of an element bg transparent? Pretty sure that’s going to require, if anything, a gradient.

[Author]

Posts