Closed nulltask closed 12 years ago
Genius. Thanks
nice! why box-shadow here though? wouldn't border be fine?
I would think border would work but you would need to leverage rgba to get the transparency no?
I think it's the subtlety
Sure,
border: 1px solid rgba(255, 255, 255, 0.3)
Would probably yield a similar effect or something similar.
@guille Thanks ;)
@visionmedia
First, I tried use border
property. but I had some layout issue on calculating box size. then I also try outline
property. but it doesn't support rounded rectangle for all browsers. box-shadow
is better solution in this situation :)
Very cool.
Did you try adding border and substracting from the width/height ?
@iammerrick right but isn't the browser support of border + rgba equivalent to box-shadow ? What would be cool however is a double border declaration, so that we get the fallback easily.
@guille Correct. However, a straight up white border might look a bit silly on older browsers. 1 line of css instead of 3 :-)
@iammerrick @guille Yes, it's very subtlety :)
@guille Yeah, I tried several times. however it was too complex to me :P
Example: http://cl.ly/0R3J1E3B3p3z033N1j3q Completely disappeared on #000 background.
Improved: http://cl.ly/0N0q3f3v1y3b2C103r0j I added iOS style border by box-shadow. (legacy IE is unsupported.)