user1054310 user1054310 - 1 year ago 56
HTML Question

HTML Div cannot be hidden when it is inside a table

I have a table like this:

<table cellpadding="0" cellspacing="0" border="0" >
<tr >

<div id="div_1c">
<td><img src="#IMAGE_PREFIX#themes/theme_15/tab_open_c.gif" alt="" /></td>
<td class="t15CurrentTabCenter"><span>Urlap megjegyzések</span></td>
<td><img src="#IMAGE_PREFIX#themes/theme_15/tab_close_c.gif" alt="" /></td>
</div>

<div id="div_1nc">
<td><img src="#IMAGE_PREFIX#themes/theme_15/tab_open.gif" alt="" /></td>
<td class="t15TabCenter" onclick="zfocus_Div('DIV_MEGJEGYZES','div_1c')" ><a href="#TAB_LINK#">Urlap megjegyzések</a></td>
<td><img src="#IMAGE_PREFIX#themes/theme_15/tab_close.gif" alt="" /></td>
</div>

<div id="div_2c">
<td><img src="#IMAGE_PREFIX#themes/theme_15/tab_open_c.gif" alt="" /></td>
<td class="t15CurrentTabCenter"><span>Üzemviteli munkák</span></td>
<td><img src="#IMAGE_PREFIX#themes/theme_15/tab_close_c.gif" alt="" /></td>
</div>

<div id="div_2nc">
<td><img src="#IMAGE_PREFIX#themes/theme_15/tab_open.gif" alt="" /></td>
<td class="t15TabCenter" onclick="zfocus_Div('DIV_UZEMVITELI_MUNKA','div_2c')"><a href="#TAB_LINK#">Üzemviteli munkák</a></td>
<td><img src="#IMAGE_PREFIX#themes/theme_15/tab_close.gif" alt="" /></td>
</div>

</tr>
</table>


Plus some Javascript code:

<script language="javascript" type="text/javascript">
function zfocus_Div(pActiveTab,pActiveDiv)
{
html_HideElement('AAA');
html_HideElement('div_1c');
html_HideElement('div_2nc');
html_HideElement('div_2c');

html_HideElement('DIV_MEGJEGYZES');
html_HideElement('DIV_UZEMVITELI_MUNKA');

html_ShowElement(pActiveTab);
html_ShowElement(pActiveDiv);
}

</script>


I execute the following code in the onload event of the page:

<script> zfocus_Div('DIV_MEGJEGYZES','div_1c') </script>


After the execution, none of the divs in the table get hidden. Can somebody please explain what the cause for this might be? As far as I know, the divs can be used within a table.

Answer Source

That's because the div elements will actually end up outside the table.

You can't have div elements (or any non-table elements) inside a table except inside td or th elements. If you try that, the browser will try to correct the code, either by removing the illegal elements, or move them outside the table.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download