Tell me more ×
Programmers Stack Exchange is a question and answer site for professional programmers interested in conceptual questions about software development. It's 100% free, no registration required.
up vote -2 down vote favorite

In CSS, what is the difference between visibility:hidden and visibility:collapse

They are given to be separate in W3Schools, but I see no difference in their output.

I have tried it in Google Crome.

share|improve this question
4  
Don't rely on W3Schools, the site has a lot of errors and inaccuracies. And despite the name has nothing to do with the W3C (see: w3fools.com). – CaffGeek Jul 12 '12 at 16:01

1 Answer

up vote 6 down vote accepted

hidden means the element is invisible, though the space it takes on the page remains.

collapsed means the element is invisible, AND the space it takes on the page is gone, but it only applies to table elements (otherwise, just like hidden).

See the details on MDN.

share|improve this answer
1  
+1 for precise definitions – ElYusubov Jul 12 '12 at 16:10
I don't think that's true, is it? display:none gives the functionality you're describing. visibility:collapse is a similar thing with table layouts, but not the same. If you apply it to non-table elements, it works like visibility:hidden. – pdr Jul 12 '12 at 17:43
@pdr - Thanks for the correction, quite right. Answer updated and link to source added. – Oded♦ Jul 12 '12 at 17:46
Both of them are giving the same output to me in Crome, what's wrong? – user221287 Jul 12 '12 at 17:58
@myselfpoddar - Probably Chrome (unless you are using an element that is not a table element). As mentioned in the linked documentation, support is not universal. – Oded♦ Jul 12 '12 at 18:00

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.