PDA

View Full Version : And it all looked so simple...

Owlie42
01-01-2004, 12:16 AM
Okay, I'm trying to do this table layout...and it's not working.
Here's what it's supposed to look like:
http://www.geocities.com/songoku_is_mine/example.html (Red lines enclose each cell)

And...it's not exactly working like that. The images are all in the wrong place...except for the first two.

Here's my code:
<html><style type="text/css">
<!--

A:link
{ text-decoration: underline overline; color:#000000 }
A:visited
{ text-decoration: underline overline; color:#000000 }
A:active
{ text-decoration: underline overline; color:#000000 }
A:hover
{ text-decoration: underline overline; font-weight: bold; color:#ffffff;

background-image:url;
background-color:#CCFFCC;

cursor: crosshair}

body
{ background-color: #cccccc;


font-family: arial;
color: #000000 ;
letter-spacing: value;(3pt)
font-weight:value; normal;
font-size:value;6 pt;


scrollbar-face-color : #cccccc;
scrollbar-highlight-color : #000000;
scrollbar-3dlight-color : #000000; scrollbar-shadow-color : #000000;
scrollbar-darkshadow-color : #000000; scrollbar-track-color : #cccccc;
scrollbar-arrow-color : #000000 }



-->
</style>
<body><center>
<table border="1" bordercolor="#000000">
<tr><td rowpsan="5"><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\farleft.JPG"></a></td><td

rowspan="5"><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\left.JPG"></a></td><td colspan="2"><img

src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\centertop.J PG"></a></td><td><img src="C:\Documents and

Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\righttop.JP G"></a></td><td colspan="2"><img src="C:\Documents and Settings\Owner\My

Documents\New Folder\kathryn\stuff\blog\layout\lotr2\farrighttop .JPG"></a></tr>

<tr><td><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\centerleft. JPG"></a></td><td colspan="3"><iframe

src="aframe.html" name="frame" width="196" height="195" border="0" frameborder="0" framespacing="0"></iframe></td><td><img src="C:\Documents and

Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\farrightrig ht.JPG"></a></td></tr>

<tr><td><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\centercente r.JPG"></a></td><td><img

src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\rightcenter .JPG"></a></td><td><img src="C:\Documents and

Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\farrightcen ter.JPG"></a></td></tr>

<tr><td><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\centerleft2 .JPG"></a></td><td colspan="3"><iframe

src="navframe.html" name="navframe" width="197" height="21" border="0" frameborder="0" framespacing="0"></iframe></td><td><img src="C:\Documents and

Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\farrightrig ht2.JPG"></a></td></tr>

<tr><td colspan="2"><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\centerbotto m.JPG"></a></td><td><img

src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\centerbotto m.JPG"></a></td><td colspan="2"><img

src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\farrightbot tom.JPG"></a></td></tr></table>
</body></html>
Alcy
01-01-2004, 12:43 AM
This is from the third row - there should be some colspans here....
<tr>
<td><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog \layout\lotr2\centercenter.JPG"></a></td>
<td><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog \layout\lotr2\rightcenter.JPG"></a></td>
<td><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog \layout\lotr2\farrightcenter.JPG"></a></td>
</tr>

This is missing a </td>
<td colspan="2"><img src="C:\Documents and Settings\Owner\My
Documents\New Folder\kathryn\stuff\blog \layout\lotr2\farrighttop .JPG"></a></td></tr>
Owlie42
01-01-2004, 12:48 AM
I'm trying to figure out where to put the colspans...
Owlie42
01-01-2004, 01:32 AM
sorry about double-posting, but I've gotten myself all confused...
Code as it stands at the moment:
<table border="1" bordercolor="#000000">
<tr><td rowpsan="5"><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\farleft.JPG"></a></td><td

rowspan="5"><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\left.JPG"></a></td><td colspan="2"><img

src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\centertop.J PG"></a></td><td><img src="C:\Documents and

Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\righttop.JP G"></a></td><td colspan="2"><img src="C:\Documents and Settings\Owner\My

Documents\New Folder\kathryn\stuff\blog\layout\lotr2\farrighttop .JPG"></a></td></tr>

<tr><td><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\centerleft. JPG"></a></td><td colspan="3"><iframe

src="aframe.html" name="frame" width="196" height="195" border="0" frameborder="0" framespacing="0"></iframe></td><td><img src="C:\Documents and

Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\farrightrig ht.JPG"></a></td></tr>

<tr><td colspan="2"><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\centercente r.JPG"></a></td><td><img

src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\rightcenter .JPG"></a></td><td colspan="2"><img src="C:\Documents

and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\farrightcen ter.JPG"></a></td></tr>

<tr><td><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\centerleft2 .JPG"></a></td><td colspan="3"><iframe

src="navframe.html" name="navframe" width="197" height="21" border="0" frameborder="0" framespacing="0"></iframe></td><td><img src="C:\Documents and

Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\farrightrig ht2.JPG"></a></td></tr>

<tr><td colspan="2"><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\centerbotto m.JPG"></a></td><td><img

src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\centerbotto m.JPG"></a></td><td colspan="2"><img

src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\farrightbot tom.JPG"></a></td></tr></table>
</body></html>

How it looks:
http://www.geocities.com/songoku_is_mine/example2.html
Rosey
01-01-2004, 08:35 AM
if i were you, i would just leave it as one picture and create something where you are going to have your iframes so that the text will show. It'll be less complicated.
Owlie42
01-01-2004, 11:45 PM
This is sort of an experiment. :lol:

I've fixed the primary problem, a typo in one of the rowspans...(I hate typos)...the only thing I can't get are the frame colspan things to work...

<table border="1" bordercolor="#000000" cellpadding="0">

<tr><td rowspan="5" cellpadding="0"><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\farleft.JPG"></a></td>
<td rowspan="5" cellpadding="0"><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\left.JPG"></a></td>
<td colspan="2" cellpadding="0"><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\centertop.J PG"></a></td>
<td cellpadding="0"><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\righttop.JP G"></a></td>
<td colspan="2" cellpadding="0"><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\farrighttop .JPG"></a></td></tr>

<tr><td cellpadding="0"><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\centerleft. JPG"></a></td>
<td cellpadding="0" colspan="4"><iframe src="aframe.html" name="frame" width="196" height="195" border="0" frameborder="0" framespacing="0"></iframe></td>
<td><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\farrightrig ht.JPG"></a></td></tr>

<tr><td colspan="2" cellpadding="0"><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\centercente r.JPG"></a></td>

<td><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\rightcenter .JPG"></a></td>
<td colspan="2" cellpadding="0"><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\farrightcen ter.JPG"></a></td></tr>

<tr><td cellpadding="0"><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\centerleft2 .JPG"></a></td><td cellpadding="0" colspan="4"><iframe src="navframe.html" name="navframe" width="197" height="21" border="0" frameborder="0" framespacing="0"></iframe></td><td><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\farrightrig ht2.JPG"></a></td></tr>

<tr><td colspan="2" cellpadding="0"><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\centerbotto m.JPG"></a></td><td cellpadding="0"><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\rightbottom .JPG"></a></td><td colspan="2" cellpadding="0"><img src="C:\Documents and Settings\Owner\My Documents\New Folder\kathryn\stuff\blog\layout\lotr2\farrightbot tom.JPG"></a></td></tr></table>
Owlie42
01-13-2004, 01:21 AM
This is kind of what I'm trying to get it to do, but not exactly.

http://www.sumatu.com/trm/index2.php
bellportal
01-15-2004, 12:29 PM
A fun project! :)

I would, however, take Rosey's advice and only have one picture. :nerd: