Forum Moderators: not2easy
First I'll try to explain what I'm trying to achieve:
I have a table with some information, and when I click a link in a table cell a transparent layer should show up, with a box containing all the relevant information.
I have done this by generating a <div id="infoX" class="transparentLayer">All info</div> right after I generated <tr><td><a href="javascript:openLayer('infoX');">Some info</a></td><tr>. This means that all the <div>'s are contained within the <table>, which probably means the html isn't exactly well formed, but I'll deal with that later :)
The openLayer javascript-function switches the display-element on the infoX from none to block. Everything works perfectly in IE7 (it's a closed system, so I don't bother about IE6), however I get a weird style error in Firefox.
I have a <form>-ellement within the <div> and in Firefox this is shown before the table, and is excluded from the box on the transparentLayer. If I remove the actual <form>-tag (and keep the <input>-tags ++) everything is shown correctly, so it must be the <form>-tag that is breaking the layout.
I have tried setting the display: inline; margin: 0; padding: 0; for the form-tag, but everything contained within the form-tag is still being shown before the table in FireFox.
----
If anyone actually understood this, I'd appreciate any ideas :)
Thanks a lot for any help.
I have done this by generating a <div id="infoX" class="transparentLayer">All info</div> right after I generated <tr><td><a href="javascript:openLayer('infoX');">Some info</a></td><tr>
So your code looks like this?
<tr>
<td><a href="...">...</a></td>
</tr>
<div>...</div>
If that's right, I'd bet your problem is there. I'm not sure whether your form should be contained in a DIV, either, but I'll leave that one to the experts. If you put your DIV either inside a table cell or outside the table entirely, does that fix the problem?
