User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1) Gecko/20061003 Firefox/2.0 Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1) Gecko/20061003 Firefox/2.0 ...<td id="col" style="width:auto">.... .... document.GetElementById('col').style.width='0px' .... IE6+ does hiding well. Looks ugly when hiding more cols. Reproducible: Always Actual Results: about 2-4 pixels are still remaining Expected Results: really 0 pixels
Please attach a complete testcase using the "Create a New Attachment" link.
Created attachment 243124 [details] html file for researching source code Here the attachment you requested.
The 'width' property specifies content width. In the attached testcase you have a 2px border on the first row cell that you toggle width:0px/auto on. Since the cells in a column needs to have equal border-box width, the cells on the other rows are forced to have a minimal width of 4px. http://www.w3.org/TR/CSS21/box.html Also, when you set width:0 you are forcing the cell content to be layed out in that cell width which means the words will stack up vertically - this is why the rows grow in height - add more text and it will become worse... I suggest you add <col> elements and toggle visibility:visible/collapse on those instead. That will do the right thing even when there are borders, cell padding etc. and you won't need the overflow:hidden either. http://www.w3.org/TR/CSS21/tables.html#q4 The layout for the attached testcase is correct per CSS 2.1. -> INVALID
Status: UNCONFIRMED → RESOLVED
Last Resolved: 12 years ago
Resolution: --- → INVALID
I tried all varies you suggested I could imagine and did not get rid of the borders. As reading the CSS reference I'll try again and post the solution if I find any.
Perfect! That exaclty meets my expection! Thanks so much! This is so easy could not get it by myself *shame*
You need to log in before you can comment on or make changes to this bug.