How to do this on CSS? ( it’s hard to explain see the picture)

[Andy_H]

Hello all,

This is pretty arbitrary and probably wont get so may answers, but if any of you have experience on layouts like this let me know your secrets. See the image what I mean.

http://www.dropbox.com/s/8bpbf19emulbhfm/problem.png

It’s about the small shadows that create the effect of a three dimensional shape. I could have 1px wide pseudo elements and then position them to be the borders of the boxes but that’s kinda hacky, then again, maybe the only way.

Now I’ve been using a wrapping element and borders. Could also use box-shadow but I need to support IE8.

Thanks!

[Anonymous]

I really dont see what your asking for. The css version almost looks identical to the image one.

[Paulie_D]

Here….zoom in to see closer: http://codepen.io/anon/pen/ixlBn

Just tweak the shades of grey to taste.

[Author]

Posts