Log in

View Full Version : Why dosen't my layout look right?


timROGERS
29-10-2005, 11:47 AM
Here is the full code for my layout:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- saved from url=(0014)about:internet -->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>index.jpg</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">td img {display: block;}body {
background-color: #ff9900;
}
</style>
<!--Fireworks 8 Dreamweaver 8 target. Created Sat Oct 29 12:38:58 GMT+0100 (GMT Standard Time) 2005-->
</head>
<body>
<center>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<table border="0" cellpadding="0" cellspacing="0" width="780">
<!-- fwtable fwsrc="Untitled" fwbase="index.jpg" fwstyle="Dreamweaver" fwdocid = "1979523505" fwnested="0" -->
<tr>
<td><img src="spacer.gif" width="33" height="1" border="0" alt="" /></td>
<td><img src="spacer.gif" width="87" height="1" border="0" alt="" /></td>
<td><img src="spacer.gif" width="29" height="1" border="0" alt="" /></td>
<td><img src="spacer.gif" width="459" height="1" border="0" alt="" /></td>
<td><img src="spacer.gif" width="27" height="1" border="0" alt="" /></td>
<td><img src="spacer.gif" width="85" height="1" border="0" alt="" /></td>
<td><img src="spacer.gif" width="60" height="1" border="0" alt="" /></td>
<td><img src="spacer.gif" width="1" height="1" border="0" alt="" /></td>
</tr>

<tr>
<td colspan="7"><img name="index_r1_c1" src="index_r1_c1.jpg" width="780" height="96" border="0" id="index_r1_c1" alt="" /></td>
<td><img src="spacer.gif" width="1" height="96" border="0" alt="" /></td>
</tr>
<tr>
<td rowspan="5"><img name="index_r2_c1" src="index_r2_c1.jpg" width="33" height="404" border="0" id="index_r2_c1" alt="" /></td>
<td rowspan="4"><iframe width="87" height="319" src="nav.htm" name="nav">&nbsp;</td>
<td rowspan="5"><img name="index_r2_c3" src="index_r2_c3.jpg" width="29" height="404" border="0" id="index_r2_c3" alt="" /></td>
<td rowspan="3"><img name="index_r2_c4" src="index_r2_c4.jpg" width="459" height="315" border="0" id="index_r2_c4" alt="" /></td>
<td rowspan="5"><img name="index_r2_c5" src="index_r2_c5.jpg" width="27" height="404" border="0" id="index_r2_c5" alt="" /></td>
<td><img name="index_r2_c6" src="index_r2_c6.jpg" width="85" height="137" border="0" id="index_r2_c6" alt="" /></td>
<td rowspan="5"><img name="index_r2_c7" src="index_r2_c7.jpg" width="60" height="404" border="0" id="index_r2_c7" alt="" /></td>
<td><img src="spacer.gif" width="1" height="137" border="0" alt="" /></td>
</tr>
<tr>
<td><img name="index_r3_c6" src="index_r3_c6.jpg" width="85" height="34" border="0" id="index_r3_c6" alt="" /></td>
<td><img src="spacer.gif" width="1" height="34" border="0" alt="" /></td>
</tr>
<tr>
<td><img name="index_r4_c6" src="index_r4_c6.jpg" width="85" height="144" border="0" id="index_r4_c6" alt="" /></td>
<td><img src="spacer.gif" width="1" height="144" border="0" alt="" /></td>
</tr>
<tr>
<td rowspan="2"><img name="index_r5_c4" src="index_r5_c4.jpg" width="459" height="89" border="0" id="index_r5_c4" alt="" /></td>
<td rowspan="2"><img name="index_r5_c6" src="index_r5_c6.jpg" width="85" height="89" border="0" id="index_r5_c6" alt="" /></td>
<td><img src="spacer.gif" width="1" height="4" border="0" alt="" /></td>
</tr>
<tr>
<td><img name="index_r6_c2" src="index_r6_c2.jpg" width="87" height="85" border="0" id="index_r6_c2" alt="" /></td>
<td><img src="spacer.gif" width="1" height="85" border="0" alt="" /></td>
</tr>
</table></center>
</body>
</html>

Why does it appear completely incorrectly, here is what it looks like:
http://www.habplus.co.uk/test

Why is it that once it reaches the iframe it just completely stops loading?
Sygon
29-10-2005, 12:11 PM
Well when i recieve the html for your site it just comes up how it loads mauybe there was something wrong ewhen you sliced it, can you provide us source without iframe?
timROGERS
29-10-2005, 12:18 PM
Heres source without iFrame:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- saved from url=(0014)about:internet -->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>index.jpg</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">td img {display: block;}body {
background-color: #ff9900;
}
</style>
<!--Fireworks 8 Dreamweaver 8 target. Created Sat Oct 29 12:38:58 GMT+0100 (GMT Standard Time) 2005-->
</head>
<body>
<center>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<table border="0" cellpadding="0" cellspacing="0" width="780">
<!-- fwtable fwsrc="Untitled" fwbase="index.jpg" fwstyle="Dreamweaver" fwdocid = "1979523505" fwnested="0" -->
<tr>
<td><img src="spacer.gif" width="33" height="1" border="0" alt="" /></td>
<td><img src="spacer.gif" width="87" height="1" border="0" alt="" /></td>
<td><img src="spacer.gif" width="29" height="1" border="0" alt="" /></td>
<td><img src="spacer.gif" width="459" height="1" border="0" alt="" /></td>
<td><img src="spacer.gif" width="27" height="1" border="0" alt="" /></td>
<td><img src="spacer.gif" width="85" height="1" border="0" alt="" /></td>
<td><img src="spacer.gif" width="60" height="1" border="0" alt="" /></td>
<td><img src="spacer.gif" width="1" height="1" border="0" alt="" /></td>
</tr>

<tr>
<td colspan="7"><img name="index_r1_c1" src="index_r1_c1.jpg" width="780" height="96" border="0" id="index_r1_c1" alt="" /></td>
<td><img src="spacer.gif" width="1" height="96" border="0" alt="" /></td>
</tr>
<tr>
<td rowspan="5"><img name="index_r2_c1" src="index_r2_c1.jpg" width="33" height="404" border="0" id="index_r2_c1" alt="" /></td>
<td rowspan="4">&nbsp;</td>
<td rowspan="5"><img name="index_r2_c3" src="index_r2_c3.jpg" width="29" height="404" border="0" id="index_r2_c3" alt="" /></td>
<td rowspan="3"><img name="index_r2_c4" src="index_r2_c4.jpg" width="459" height="315" border="0" id="index_r2_c4" alt="" /></td>
<td rowspan="5"><img name="index_r2_c5" src="index_r2_c5.jpg" width="27" height="404" border="0" id="index_r2_c5" alt="" /></td>
<td><img name="index_r2_c6" src="index_r2_c6.jpg" width="85" height="137" border="0" id="index_r2_c6" alt="" /></td>
<td rowspan="5"><img name="index_r2_c7" src="index_r2_c7.jpg" width="60" height="404" border="0" id="index_r2_c7" alt="" /></td>
<td><img src="spacer.gif" width="1" height="137" border="0" alt="" /></td>
</tr>
<tr>
<td><img name="index_r3_c6" src="index_r3_c6.jpg" width="85" height="34" border="0" id="index_r3_c6" alt="" /></td>
<td><img src="spacer.gif" width="1" height="34" border="0" alt="" /></td>
</tr>
<tr>
<td><img name="index_r4_c6" src="index_r4_c6.jpg" width="85" height="144" border="0" id="index_r4_c6" alt="" /></td>
<td><img src="spacer.gif" width="1" height="144" border="0" alt="" /></td>
</tr>
<tr>
<td rowspan="2"><img name="index_r5_c4" src="index_r5_c4.jpg" width="459" height="89" border="0" id="index_r5_c4" alt="" /></td>
<td rowspan="2"><img name="index_r5_c6" src="index_r5_c6.jpg" width="85" height="89" border="0" id="index_r5_c6" alt="" /></td>
<td><img src="spacer.gif" width="1" height="4" border="0" alt="" /></td>
</tr>
<tr>
<td><img name="index_r6_c2" src="index_r6_c2.jpg" width="87" height="85" border="0" id="index_r6_c2" alt="" /></td>
<td><img src="spacer.gif" width="1" height="85" border="0" alt="" /></td>
</tr>
</table></center>
</body>
</html>

It displays fine without the iframe. When I close the iframe tag properly it slightly changes it, but it dosen't fix it, here is a link to it with proper closure:

http://www.habplus.co.uk/test
nets
29-10-2005, 01:05 PM
I'll see if I can find out whats wrong, I just need to get something to eat.
timROGERS
29-10-2005, 01:07 PM
OK, I get everything working, and it looks nice, but as soon as I add in the iframe it breaks it.
nets
29-10-2005, 01:09 PM
This could be because there is padding in the column, and your iframe is at the pixel size of the table and the padding.
timROGERS
29-10-2005, 01:11 PM
So, what would be the correct iframe code? Will you give it to me so I may learn from my mistake

By the way, this is my first ever layout I've designed and tried to code, and unlike many people I haven't asked for someone to do it for me, I've tried and came to an error, and now I need some help so that I may learn
nets
29-10-2005, 01:23 PM
Ok I've looked at the code and I think the problem is that on line 50 you have a non breaking space under the Iframe (Causing the column to stretch bigger than it should).


<TD rowSpan=4><IFRAME name=nav src="index_jpg_files/nav.htm" frameBorder=0
width=87 height=319></IFRAME>&nbsp;
</TD>

Delete the non breaking space "&nbsp;" so your code looks like this on line 50, and I think it should work.


<TD rowSpan=4><IFRAME name=nav src="index_jpg_files/nav.htm" frameBorder=0
width=87 height=319></IFRAME>
</TD>
timROGERS
29-10-2005, 01:34 PM
THanks, that fixed it! +REP

Want to hide these adverts? Register an account for free!