CODEWITHSUNDEEP
cssgoogle-chromevisibility
Mike Gorman
Mike Gorman

Reputation: 11

Inline CSS style "visibility" set to "visible" but computed style is "hidden". Why?

I have explicitly specified an element as "visibility: visible" yet it doesn't display in Chrome. Using Chrome's Developer Tools, I can see the inline style specified, but the "Computed Style" shows "visibility: hidden".

Well that explains why it's not displaying in Chrome, but I don't understand what's causing Chrome to compute the visibility to be hidden. (Appears to work correctly in all other browsers.)

I have also inspected all parent elements and all either do not mention visibility or specify it to be visible.

I executed the following JavaScript command directly, via the Developer Tools console, to no avail (computed visibility remained "hidden"): 

document.getElementById("c_311").style.visibility="visible"

See screenshot here: http://oi52.tinypic.com/ezrdcy.jpg

Upvotes: 1

Views: 6953

Answers (2)

scrat.squirrel
scrat.squirrel

Reputation: 3826

I know this is late, but I had the same issue lately, with Chrome 23. It seems like the secret is to also set the display property, like so:

domElem.style.visibility = 'visible';
domElem.style.display = 'block';//this is needed mainly for Chrome

and, to hide:

domElem.style.visibility = 'hidden';
domElem.style.display = 'none';//this is needed mainly for Chrome

It seems like Chrome uses a computed setting for visibility. IE and FF will hide or show the element when 'visibility' is set, regardless of 'display' property.

Upvotes: 2

Saeed Neamati
Saeed Neamati

Reputation: 35842

Which version of Chrome are you using? It has some bugs on version 11. See this post.

Upvotes: 0

Related Questions