Trying to hide a DIV with table formatting

I am trying to hide the contents of a DIV but can't seem to get it to work.
The contents don't hide unless I take out the table formatting. Is there a way to get this to work with the formatting?

<div id="spo" style="display: none">
<!-- <td>Audit Number:</td>
<td><input type="text" name="audit"></td> -->
test
</div>

<div id="not_spo" style="display: none">
<tr><td>LID Number:</td>
<td><input type="text" name="lid"></td>
<td>BaaN Number:</td>
<td><input type="text" name="baan"></td></tr>
</div>

I have also tried visibility:hidden

<div id="not_spo" style="display: none">
<tr><td>LID Number:</td>
<td><input type="text" name="lid"></td>
<td>BaaN Number:</td>
<td><input type="text" name="baan"></td></tr>
</div>That construct isn't valid; a table row (tr) element must be the child of a table element — the table element is missing in that code.

CSS:
#not_spo {display: none;}

HTML:
<div id="not_spo">
<table>
<tr>
<td><abbr title="…">LID</abbr> Number:</td>
<td><input type="text" name="lid"></td>
<td><abbr title="…">BaaN</abbr> Number:</td>
<td><input type="text" name="baan"></td>
</tr>
</table>
</div>