Safari 2.0, display:none, and getComputedStyle
It almost sounds like the beginning of a joke...("Safari, Display:none and getComputedStyle walk into a bar..."). Anyways, I just ran into this and thought I'd share.
In Safari 2.0.4 (419.3), you can't use getComputedStyle on an element that has display set to none. It's like the element doesn't even exist. Luckily, the latest Webkit builds have fixed this little niggle.
For a quick test case, check out the following. Click on "get style" and you should see [object CSSStyleDeclaration]. Click on toggle display to hide the content and then click on "get style" again. In Safari, you'll get null. Null is bad.
How often does Safari get updated anyways?
Conversation
> How often does Safari get updated anyways?
Pretty often. Yeah, I know that's not a very scientific answer. But, Safari is updated along with almost every OS point release, and usually a few times in between. On average, I'd say it's maybe every two months?
Here’s a nice overview of the safari version number history:
http://developer.apple.com/internet/safari/uamatrix.html
I sadly think that Apple could include finally Firefox as its default browser in MAC OS X. All we know that's a complicated change to them, but will be a nice decision isn't it?
I found some issues in Safari in the past, fortunetly it seems a lot of them have been solved. The major problem: Safari is based on the old Konqueror brower :|
Nice blog snook
Adrian: that's a great link. Thanks!
Safari's handling of display:none has bit me before, too, which is never fun. In fact, it was troublesome for a previous project for the same client.
Luis: sometimes it feels like every OS should just use Firefox as the default. :)
I always thought that elements given the display: none; attribute are treated as if they don't exist in the document flow.
On a related note, anyone tried solving Safari ignoring backround: none on input elements. It seems Apple is hell bent on applying that aquafied look on its buttons and form elements no matter what you do.
Also, if you have an input field in a div display:none, the field is not posted with the form.
Thank you for the test page.
Marco: yeah, display:none should be treated as if it doesn't exist in the document flow. But Safari treats it like it doesn't exist. :)
Prototype deals with this issue by temporarily showing the hidden element with
visibilityset to hidden andpositionto absolute.That bug has been aroun for a while, btw.
Tobie: actually, the getStyle method in Prototype doesn't do that. I believe some of the stuff within Scriptaculous does.
The fact that we're talking 2.0, I think the fact the bug still exists is self evident that it has been around for awhile. Despite that, a search on the matter didn't really reveal any insight, which is why I wanted to document it here.
Jonathan, you are totally right...
Actually it is the
getDimensionsmethod which uses this technique.But is should definitely be extended to
getStylein regards to what you mention.I am sometimes surprised by the amount of bugs Safari has. We all spend our time bashing on IE, but if, for example, we cannot device a cross-browser rich text editor, it is not because of IE, but of Safari.
It is also because of Safari that we cannot have a cross browser way dealing with navigation history and back-button functionality when using Ajax.
Tobie: yeah... the problem with modifying the style of an object to use getStyle means that you could never use it to retrieve
displayorvisibilityvalues. Not a big deal, I'm sure but certainly a consideration.Luis: I disagree, Safari was the first browser to pass the Acid2 test, and is in some aspects a better browser than firefox, I would rather have Microsoft change there standard browser to Firefox as it is still lagging behind greatly.
And remember what happened with IE when they had the biggest market share, they stopped innovating. Now there are still some points Firefox can learn from Opera and Safari and if these go away then it will be impossible to learn from the other browsers.
If some parent element has its display set to "none", than the mentioned fix still doesn't work...
safari (webkit) should and probably always will be bundled w/ apple software since webkit is intertwined into many of apple's applications nowadays. its even in itunes store for windows for petes sake.
plus webkit is so far the most css3 compliant browser around.