Note that there are some explanatory texts on larger screens.

plurals
  1. POalign nested tables in IE
    primarykey
    data
    text
    <p>This is my first question here so let me know if i have not understood the site ethos ;)</p> <p>I have written a html page for showing and hiding nested tables. I would like to get the columns to align correctly. I have got close by setting the columns to have a specific width</p> <p><strong>in both IE and firefox the columns are a few pixels out... - how can i fix this?</strong></p> <pre><code>&lt;html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;head&gt; &lt;title&gt;item List&lt;/title&gt; &lt;script type="text/javascript"&gt; &lt;!-- function toggle_visibility(id) { var e = document.getElementById(id); if(e.style.display == '') { e.style.display = 'block'; } if(e.style.display == 'block') e.style.display = 'none'; else e.style.display = 'block'; } //--&gt; &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div id="root"&gt; &lt;table border="1" cellspacing="0" width="100%"&gt; &lt;tbody&gt; &lt;tr&gt; &lt;td width="200"&gt; &lt;p&gt;&lt;a href="#" onclick="toggle_visibility('itemAAA');"&gt;itemA&lt;/a&gt;&lt;/p&gt; &lt;/td&gt; &lt;td width="200"&gt;Feild2&lt;/td&gt; &lt;td width="200"&gt;Feild3&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td colspan="3"&gt; &lt;div id="itemAAA"&gt; &lt;table border="1" cellspacing="0" width="100%"&gt; &lt;tbody&gt; &lt;tr&gt; &lt;td width="200"&gt; &lt;p&gt;&lt;a href="#" onclick="toggle_visibility('itemAA');"&gt;itemAA&lt;/a&gt;&lt;/p&gt; &lt;/td&gt; &lt;td width="200"&gt;Feild2&lt;/td&gt; &lt;td width="200"&gt;Feild3&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td colspan="3"&gt; &lt;div id="itemAA"&gt; &lt;table border="1" cellspacing="0" width="100%"&gt; &lt;tbody&gt; &lt;tr&gt; &lt;td width="200"&gt; &lt;p&gt;itemAAA&lt;/p&gt; &lt;/td&gt; &lt;td width="200"&gt;Feild2&lt;/td&gt; &lt;td width="200"&gt;Feild3&lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;/table&gt; &lt;/div&gt; &lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;/table&gt; &lt;/div&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td width="200"&gt; &lt;p&gt;itemB&lt;/p&gt; &lt;/td&gt; &lt;td width="200"&gt;Feild2&lt;/td&gt; &lt;td width="200"&gt;Feild3&lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;/table&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>any ideas? is there a better option to acheive the same functionality?</p> <p>David</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload