Table issue in IE

Associate
Joined
13 Jan 2007
Posts
2,424
Location
Belfast,Northern Ireland
At a bit of a loss to workout how the hell this happened but it has, im 100% sure it wasn't like this before but guess I must have changed something and forgot. Must make clear this only happens in IE, in chrome and FF it looks fine.

Basically my table has a weird split in it between the first element and the rest. Here is how it looks:

tableissue.png


Here is the HTML code:
Code:
 <form method="post" action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>">
            <table id="rounded-corner" summary="Top Ten Tunes for Queen's Radio">
            <thead>
            <tr>
            <th class="rounded-artist" scope="col">ARTIST NAME</th>
            <th scope="col">SONG TITLE</th>
            <th scope="col">POSITION</th>
            <th scope="col">UPDATE</th>
            <th class="rounded-end" scope="col">REMOVE</th>
            </tr>
            </thead>
            <tbody>
             <?php echo $menuDisplay; ?>
             </tbody>
              <tfoot>
    		<tr>
        	<td colspan="4" class="rounded-foot-left"><em>Please ensure the same song is not entered twice into the system, there is no existing validation for it.</em></td>
        	<td class="rounded-foot-right">&nbsp;</td>
        	</tr>
    		</tfoot>
             </table>
             </form>

Here is the PHP code:
Code:
$menuDisplay .= '<form name="'.$pid.'" action="'.htmlentities($_SERVER['PHP_SELF']).'" method="post"><input type="hidden" name="songid" value="'.$pid.'" <tr><td>' . $artist . '</td><td>' . $song . '</td><td><input type="text" style="width:30px" id="position" name="position" maxlength="2" value=" ' . $position . '"</td><td><input type="submit" name="save" value="Update"></td><td> <input type="submit" onclick="return confirmDelete();" name="delete" value="Delete" /></td></tr></form> ';

I can see no reason why this is occuring, I guessed it must be styling but I dont know what attribute would effect one row and no others?
 
Im pretty sure there was no issue with this before, I appreciate its probably not the best way to do things but its the only thing I could think of. Plus it functions fine in FF and chrome so surely it can be fine? W3C validator doesnt complain either

There's a form on each table row technically so if that was the issue there would be a huge break between each row?
 
Last edited:
solved it, was indeed the surrounding form causing the issue.

Forgive me for my stupidity but how can I pass the the relevant id's in the buttons without the use of forms?
 
Back
Top Bottom