Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

jive

macrumors 6502a
Original poster
Apr 14, 2006
501
0
Scotland
Why does the table sit out of order? I've not used tables in such a long time I've forgotten how to tweak them.

Code:
<html>
<head>
<title>goodspaces</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table id="Table_01" width="600" height="707" border="0" cellpadding="0" cellspacing="0">
	<tr>
		<td colspan="9">
			<img src="http://thetwoofhearts.com/goodspaces/images/goodspaces_01.jpg" alt="" width="600" height="232" hspace="0" vspace="0" border="0"></td>
	</tr>
	<tr>
		<td rowspan="7">
			<img src="http://thetwoofhearts.com/goodspaces/images/goodspaces_02.jpg" width="20" height="475" alt="" hspace="0" vspace="0" border="0"></td>
		<td colspan="3">
			<img src="http://thetwoofhearts.com/goodspaces/images/image1.jpg" width="270" height="180" alt="" hspace="0" vspace="0" border="0"></td>
		<td rowspan="7">
			<img src="http://thetwoofhearts.com/goodspaces/images/goodspaces_04.jpg" width="20" height="475" alt="" hspace="0" vspace="0" border="0"></td>
		<td colspan="3">
			<img src="http://thetwoofhearts.com/goodspaces/images/image2.jpg" width="270" height="180" alt="" hspace="0" vspace="0" border="0"></td>
		<td rowspan="7">
			<img src="http://thetwoofhearts.com/goodspaces/images/goodspaces_06.jpg" width="20" height="475" alt="" hspace="0" vspace="0" border="0"></td>
	</tr>
	<tr>
		<td colspan="3">
			<img src="http://thetwoofhearts.com/goodspaces/images/goodspaces_07.jpg" width="270" height="20" alt="" hspace="0" vspace="0" border="0"></td>
		<td colspan="3">
			<img src="http://thetwoofhearts.com/goodspaces/images/goodspaces_08.jpg" width="270" height="20" alt="" hspace="0" vspace="0" border="0"></td>
	</tr>
	<tr>
		<td colspan="3">
			<img src="http://thetwoofhearts.com/goodspaces/images/image3.jpg" width="270" height="180" alt="" hspace="0" vspace="0" border="0"></td>
		<td colspan="3">
			<img src="http://thetwoofhearts.com/goodspaces/images/image4.jpg" width="270" height="180" alt="" hspace="0" vspace="0" border="0"></td>
	</tr>
	<tr>
		<td colspan="3">
			<img src="http://thetwoofhearts.com/goodspaces/images/goodspaces_11.jpg" width="270" height="20" alt="" hspace="0" vspace="0" border="0"></td>
		<td colspan="3" rowspan="2">
			<img src="http://thetwoofhearts.com/goodspaces/images/goodspaces_12.jpg" width="270" height="37" alt="" hspace="0" vspace="0" border="0"></td>
	</tr>
	<tr>
		<td rowspan="3">
			<img src="http://thetwoofhearts.com/goodspaces/images/goodspaces_13.jpg" width="132" height="75" alt="" hspace="0" vspace="0" border="0"></td>
		<td>
			<img src="http://thetwoofhearts.com/goodspaces/images/goodspaceslink.jpg" width="127" height="17" alt="" hspace="0" vspace="0" border="0"></td>
		<td rowspan="3">
			<img src="http://thetwoofhearts.com/goodspaces/images/goodspaces_15.jpg" width="11" height="75" alt="" hspace="0" vspace="0" border="0"></td>
	</tr>
	<tr>
		<td rowspan="2">
			<img src="http://thetwoofhearts.com/goodspaces/images/goodspaces_16.jpg" width="127" height="58" alt="" hspace="0" vspace="0" border="0"></td>
		<td rowspan="2">
			<img src="http://thetwoofhearts.com/goodspaces/images/goodspaces_17.jpg" width="25" height="58" alt="" hspace="0" vspace="0" border="0"></td>
		<td>
			<img src="http://thetwoofhearts.com/goodspaces/images/goodspaces_18.jpg" width="26" height="16" alt="" hspace="0" vspace="0" border="0"></td>
		<td rowspan="2">
			<img src="http://thetwoofhearts.com/goodspaces/images/goodspaces_19.jpg" width="219" height="58" alt="" hspace="0" vspace="0" border="0"></td>
	</tr>
	<tr>
		<td>
			<img src="http://thetwoofhearts.com/goodspaces/images/goodspaces_20.jpg" width="26" height="42" alt="" hspace="0" vspace="0" border="0"></td>
	</tr>
</table>
</body>
</html>

Anyone care to point out the obvious?
 

Attachments

  • Picture 1.png
    Picture 1.png
    391.1 KB · Views: 94
Can you elaborate on what you mean by 'out of order,' and how it should be? My rendering seems the same except doesn't have those white lines at the bottom of your screen shot.
 
Well, it should render perfectly (as it does on Firefox, Safari etc) but in Gmail it doesn't and I don't know why but I would like to fix it.

Testing the code in a browser shows it fine, but due to Email programs being years behind it's throwing me a bit of a curve ball.
 
Well, it should render perfectly (as it does on Firefox, Safari etc) but in Gmail it doesn't and I don't know why but I would like to fix it.

Testing the code in a browser shows it fine, but due to Email programs being years behind it's throwing me a bit of a curve ball.

That didn't quite explain the 'out of order.' Are the text and images suppose to be in a different order? Is it those white lines you're concerned with? Testing for email app specifics is tough, especially since I can't test it out. Code-wise, it's OK, doesn't validate, but nothing huge. So there's nothing obvious that may be wrong. Maybe it's Gmail's fault.
 
I suggest removing the height and width from the table tag. I didn't bother to check the math, but some browsers/web interfaces/apps might render oddly if the combined static height and width of the images in all the TD's do not match the table static height and width. In your case, all TD's are sized statically by the images you inserted. Just a quick thing to check, otherwise, it does look ok and validates as others noted so that's my only guess so far.

-jim
 
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.