CSS3 Box shadow size – percent units?

Question

I\'m working on a project that needs to use CSS3 box-shadow property. That\'s fine, but I have found out that spread size of shadow can\'t be set to a percentage of parent objec

Answer 1

Have you tried using the rem unit (root em unit)? I believe you can use this to make it scale fluidly.

The rem unit is always relative to the root html element, so it will scale accordingly and you don't have to worry about inner containers or anything like that. It also has pretty broad browser support at this point.

I use it on my projects to make them more responsive, but always follow a parameter already defined by px or em so that it fails gracefully just in case. For example:

font-size: 14px; font-size: 1.4rem;

Here's a great article explaining everything you need to know about this unit: http://snook.ca/archives/html_and_css/font-size-with-rem