By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
444,119 Members | 2,086 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 444,119 IT Pros & Developers. It's quick & easy.

Column Visibility Collapse Problem

P: n/a
Stylists...

I'm having problems collapsing a column. Specifically, I want to
collapse the last column of a table. My initial test with a large data
set worked, but I cannot make it work with a small example.

Here are links to the data files (source included below):

http://home.covad.net/~holmespun/200...apse_test.html
http://home.covad.net/~holmespun/200...lapse_test.css

These Validate for HTML and CSS using the W3C validation tools.

I'm working with FF 1.0.1 (Windows & Linux). The test also fails for IE
6.0 but I already know of a "display:none" work-around.

http://www.richinstyle.com/test/tabl...ycollapse.html

I would not be concerned, but for my initial success, and for the fact
that the RichInStyle.com test page for collapsing columns (link above)
appears to work.

Additional note 1: Adding "visibility:collapse" style to the <th> and
each <td> of the third column causes the data in these cells to be
hidden in FF, but the column still does not collapse.

Additional note 2: Adding the IE work-around "display:none" style to
the third column causes FF to ignore the column width setting. FF
correctly ignores the "display:none" style for the column.

Thanks in advance.

....Holmespundit

-- CSS Follows:

/*
** 20050320_column_visibility_collapse_test.css
*/

table {
border: 2px solid;
}

td {
border: 1px dashed;
text-align: center;
}

col {
width: 200px;
}

col.noshow {
visibility: collapse;
}

/* (eof)
*/
-- HTML Follows:

<?xml version="1.0" encoding="ISO-8859-1"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

<head>

<title>
20050320 Column Visibility Collapse Test
</title>

<style type="text/css">
@import "20050320_column_visibility_collapse_test.css" ;
</style>

</head>

<body>

<h1>
20050320 Column Visibility Collapse Test
</h1>

<div>

<table>

<col/>
<col/>
<col class="noshow"/>

<tr>
<th>One</th>
<th>Two</th>
<th>Three</th>
</tr>

<tr>
<td>Uno</td>
<td>Due</td>
<td>
Many words that should not be seen.
</td>
</tr>
<tr>

<td>Won</td>
<td>Too</td>
<td>
Many words that should not be seen.
Many words that should not be seen.
Many words that should not be seen.
</td>
</tr>
</table>

</div>

</body>
</html>

Jul 21 '05 #1
Share this Question
Share on Google+
1 Reply


P: n/a
DU
Holmespundit wrote:
Stylists...

I'm having problems collapsing a column. Specifically, I want to
collapse the last column of a table.


Valid and cross-browser interactive demo working for MSIE 6, Mozilla
1.x, Opera 7.x, NS 7.x:

http://www.gtalbot.org/HTMLJavascrip...nCollapse.html

With border-collapse: collapse, there will be layout bugs.

DU
--
The site said to use Internet Explorer 5 or better... so I switched to
Mozilla 1.7.6 :)
Jul 21 '05 #2

This discussion thread is closed

Replies have been disabled for this discussion.