CODEWITHSUNDEEP
csswebkitscrollbarosx-mountain-lion
Jacob Krall
Jacob Krall

Reputation: 28825

Scroll bar covering interaction element in WebKit on Mountain Lion

I have a tiny button floated to the right edge of its container, which has the style overflow-y: scroll. On Mac OS X Mountain Lion, in Safari and Chrome, on devices that have a trackpad and no mouse, this tiny button is covered up by Mountain Lion's new hidden scrollbars.

How can I detect when my tiny button is in this situation and/or ensure it is not covered by the scroll bar?

Fiddle: http://jsfiddle.net/jP8rg/

A similar question with no answer: CSS hover bug on Lion/Mountain Lion with hidden scrollbars

Upvotes: 3

Views: 979

Answers (1)

busticated
busticated

Reputation: 2187

well, assuming you can't just put a little margin-right in there so the elements no longer overlap or tweak the design to avoid the issue altogether, you could style the scrollbar... well, in webkit-ish browsers at least.

here's a good overview --> http://css-tricks.com/custom-scrollbars-in-webkit/

having lived thru the early days of customized scrollbars, i personally would avoid if at all possible.

with a little work, you can also detect when scrollbars are present... sorta.

some options here --> Scrollbar appear / disappear event in jQuery?

Upvotes: 1

Related Questions