Geek Answers Handbook

Visibility alternative: crash doesn't work on IE and Chrome

Next page:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <STYLE type="text/css"> tr.cccc { visibility: collapse; } </STYLE> <BODY> <TABLE border="1"> <TR class="cccc"> <TD>one</TD> </TR> </TABLE> </BODY> </HTML>

only works in Firefox. IE always displays the string, and Chrome hides the string, but shows its vertical space. So, how can I completely hide the string using only CSS?

+7
visibility html css html-table
source share
5 answers

Use
display: none

instead of visibility: crash

Works for me to hide the summary row of the dojo tree in IE6 and Google Chrome

+14
source share
 visibility: collapse

was implemented in IE8

http://msdn.microsoft.com/en-us/library/ms531180%28VS.85%29.aspx

+2
source share

visibility: collapse does not work in IE. The source seems you need to use hidden instead of IE. See the linked page for details.

However, the specification clearly states that in the case of columns, only collapse is a valid value. Collapse is only supported by Firefox. Since Windows Explorer supports all style declarations on columns, it also supports: hidden visibility.

In addition, it does not hurt to build a complete HTML structure:

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <HTML> <HEAD> <STYLE type="text/css"> .... </STYLE> </HEAD> ...
+1
source share

This is deprecated, but you can use innerHTML to overwrite the parts you want to leave.

0
source share

Well, it seems that visibility: collapse can also be used in IE. I use it and it works in both IE and Firefox. I don’t know about other browsers except these two.

I have done the following:

HTML:

<table class="intValidationTable">

<tr class="rangeTR" style="visibility: collapse;">

<tr class="listTR" style="visibility: collapse;">

Javascript + jQuery:

var rows = $('table.intValidationTable tr');

var rangeTR = rows.filter('.rangeTR');

var listTR = rows.filter('.listTR');

rangeTR.css("visibility", "visible");

listTR.css("visibility", "collapse");

That should work!

0
source share

More articles:


All Articles