Hard to see scrollbar when using darker background color. #18

Merged
merged 1 commit into from Mar 21, 2012

Projects

None yet

4 participants

@nulltask

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.)

@rauchg

Genius. Thanks

@rauchg rauchg merged commit 60bb4e9 into Automattic:master Mar 21, 2012
@tj
tj commented Mar 21, 2012

nice! why box-shadow here though? wouldn't border be fine?

@iammerrick

I would think border would work but you would need to leverage rgba to get the transparency no?

@rauchg

I think it's the subtlety

@iammerrick

Sure,

border: 1px solid rgba(255, 255, 255, 0.3)

Would probably yield a similar effect or something similar.

@nulltask

@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 :)

@iammerrick

Very cool.

@rauchg

Did you try adding border and substracting from the width/height ?

@rauchg

@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.

@iammerrick

@guille Correct. However, a straight up white border might look a bit silly on older browsers. 1 line of css instead of 3 :-)

@nulltask

@iammerrick @guille
Yes, it's very subtlety :)

@nulltask

@guille
Yeah, I tried several times. however it was too complex to me :P

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment