Table cells always expand as far as they can and allocate cell widths or heights in proportion.
You have images 100px and 640px wide totalling 740px but your table is 895px wide so the cells create space around the images.
If you reduce the table width to 740px the extra space will disappear, but the lower cells also become only 740px wide in total.
The same happens with the height; your table is 430px high; the lower th cell is 192px high leaving 430-100-192=138px remaining space which is allocated in proportion 100:192 to the top and lower cells which means about 1/3 of 138 to top height and 2/3 of 138 to the bottom height which shows as padding above and below the images.
So there are two options.
If you reduce the height of the table to 100+192=292px then the top th row will be 100px high and the bottom row will stay as 192px but the whole table will be shorter.
Or leave the table height as 430px and edit the bottom th cell height to height="330" (the images will set the height of 100px for the top th cells and the remainder is 330px).
A third option is to leave the table as 430px high and add height="100" to the top th cells and delete the height="192" from the lower th cell. This works in Firefox but not in IE7 so ignore this.
It is a good idea to add cellpadding="0" to the table as most browsers add a small 2px default padding.
You have used th for some cells instead of td. Remember that this usually makes text bold and centralised in most browsers.
Code:
<table width="895" height="430" border="1" cellpadding="0">
<tr>
<th scope="col"><img src="100x100.jpg" alt="logo" name="Logo" width="100" height="100" id="Logo"/></th>
<th colspan="2" scope="col"><img src="" alt="header" name="Header" width="640" height="100" id="Header" /></th>
</tr>
<tr>
<th scope="row" height="330"> </th> <!--was height="192"-->
<td colspan="2"> </td>
</tr>
</table>
Code downloaded to my PC will be deleted in due course.
WIN7; IE9, Firefox, Opera, Chrome and Safari for Windows; screen resolution usually 1366*768.
Also IE6 on W98 with 800*600 and IE8 on Vista 1440*900.
Reply With Quote
