Skip to main content

CSS Corners (Rounded w/ Inner Shadow)

It is now 1am – and I have spent the entire day trying to come up with a solution to rounded corners with an INNER rather than OUTER shadow. I have Googled. I have posted to every CSS listserv I am a member of to no resolve.. until now.

What I needed to do was to make this image into a flexible width, rounded corner CSS. I sliced up the image and used Roger’s Flexible CSS Teaser Box as my model. My result was not what I needed – and I was pointed by a few members of the WSG list to Roger’s other Flexible CSS w/ custom borders (which I have utilized in the past with no problem).

Only, it would not work either… It uses ONE image to create the borders on the right and left, and being as my shadows are set inside the box, I would have to have two (one left+shadow right, one right+shadow left) therefore this one would not work either tadalafil india

I tried every possible CSS rounded corner template I could google to no avail… Kindly, Jeff Lowder of Accessibility 1st spent time that I am sure he did not have and got the solution (well at least for standard compliant browsers).

So now – I am thrilled to have at least a solution for compliant browsers!

Here it is: Flexible Rounded Corners with INNER shadow!

Thanks again Jeff!


The analytical mind behind Zenful Creations. Responsible for all the bells and whistles; dedicates most of her time to breaking stuff and finding bugs and never enough time to fixing things.

4 thoughts to “CSS Corners (Rounded w/ Inner Shadow)”

Comments are closed.