- blog n.
- Website on which an individual or group of users produces an ongoing narrative.
25 01/2010Firefox & Safari incorrectly sizing table on hide/show
The tables in question have a fixed width and render perfectly without the hide/show mechanism and also (bizarrely) render correctly with the hide/show engaged in IE(Internet Explorer) but in Firefox and Safari, we get an odd gap on the right hand side of the table.
I’m using a simple jQuery slideToggle function which works perfectly elsewhere but in this case the data tables were creating a bug somewhere.
After checking the markup thoroughly and ensuring the page validated I spent an hour or so tooling around with the CSS to ensure I wasn’t causing the problem myself but to no avail.
I finally came to the conclusion that the faulty browsers are incorrectly calculating the table cell widths when switching from display:none to display:block.
Hope this helps if you encounter the same problem and would love to hear if anyone has a solution without the additional markup.