Nicholas
28-10-2006, 04:31 PM
Wee!
I coded something in expandable tables today.
It was really easy thanks to Joe .C. & FallenAsh [Whom you may not know]
However, it's not up to tip top scratch so I need your help to make the code perfect! :eusa_danc
Here's what it looks like in FireFox:
Problems:
The text is vertically centered :(
Both boxes expand to the same size, I do not want this I want one box to be a different size to the other [E.g. if the navigatort is smaller]http://i14.tinypic.com/4ggmckp.png
Link (http://i14.tinypic.com/4ggmckp.png)
Here's what it looks like in IE 7.
Problems:
As you can see it's 'muffed up'
The text aligned againhttp://i13.tinypic.com/3y6ats5.png
Link (http://i13.tinypic.com/3y6ats5.png)
Code?
Here's my code [I used Photoshop & Dreamweaver]
<HTML>
<HEAD>
<TITLE>Untitled-1</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body {
background-color: #444444;
}
body,td,th {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 9px;
}
-->
</style></HEAD>
<BODY LEFTMARGIN=0 TOPMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0>
<div align="center">
<p>
<!-- ImageReady Slices (Untitled-1) -->
</p>
<p> </p>
<p> </p>
<TABLE WIDTH=150 BORDER=0 CELLPADDING=0 CELLSPACING=0>
<TR>
<TD COLSPAN=9>
<IMG SRC="images/index_01.gif" WIDTH=150 HEIGHT=15 ALT=""></TD>
</TR>
<TR>
<TD ROWSPAN=4>
<IMG SRC="images/index_02.gif" WIDTH=5 HEIGHT=135 ALT=""></TD>
<TD COLSPAN=3>
<IMG SRC="images/index_03.gif" WIDTH=69 HEIGHT=34 ALT=""></TD>
<TD ROWSPAN=4>
<IMG SRC="images/index_04.gif" WIDTH=3 HEIGHT=135 ALT=""></TD>
<TD COLSPAN=3>
<IMG SRC="images/index_05.gif" WIDTH=69 HEIGHT=34 ALT=""></TD>
<TD ROWSPAN=4> </TD>
</TR>
<TR>
<TD background="images/index_07.gif" width="5" height=100%></TD>
<TD background="images/index_08.gif" width=59>Hey</TD>
<TD background="images/index_09.gif" width="5" height=100%></TD>
<TD background="images/index_10.gif" width="5" height=100%></TD>
<TD background="images/index_11.gif" width="59">The content goes here and the box should expand to the size of your content. Ok, whilst we wait I'll tell you about me, I am called Myke and I enjoy web designing :] It's great fun, I could die for it, I'd like to thanks FallenAsh and Joe .C. they have both helped me greatly. Right, let's check has it expanded yet?</TD>
<TD background="images/index_12.gif" width="5" height=100%>
<IMG SRC="images/index_12.gif" WIDTH=5 HEIGHT=81 ALT=""></TD>
</TR>
<TR>
<TD COLSPAN=3>
<IMG SRC="images/index_13.gif" WIDTH=69 HEIGHT=5 ALT=""></TD>
<TD COLSPAN=3>
<IMG SRC="images/index_14.gif" WIDTH=69 HEIGHT=5 ALT=""></TD>
</TR>
<TR>
<TD COLSPAN=3>
<IMG SRC="images/index_15.gif" WIDTH=69 HEIGHT=15 ALT=""></TD>
<TD COLSPAN=3>
<IMG SRC="images/index_16.gif" WIDTH=69 HEIGHT=15 ALT=""></TD>
</TR>
</TABLE>
<img src="images/index_06.gif" width=4 height=135 alt="">
<!-- End ImageReady Slices -->
</div>
</BODY>
</HTML>
If you can help, + Rep will be awarded.
P.s. This layout was just a quicky.
I coded something in expandable tables today.
It was really easy thanks to Joe .C. & FallenAsh [Whom you may not know]
However, it's not up to tip top scratch so I need your help to make the code perfect! :eusa_danc
Here's what it looks like in FireFox:
Problems:
The text is vertically centered :(
Both boxes expand to the same size, I do not want this I want one box to be a different size to the other [E.g. if the navigatort is smaller]http://i14.tinypic.com/4ggmckp.png
Link (http://i14.tinypic.com/4ggmckp.png)
Here's what it looks like in IE 7.
Problems:
As you can see it's 'muffed up'
The text aligned againhttp://i13.tinypic.com/3y6ats5.png
Link (http://i13.tinypic.com/3y6ats5.png)
Code?
Here's my code [I used Photoshop & Dreamweaver]
<HTML>
<HEAD>
<TITLE>Untitled-1</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body {
background-color: #444444;
}
body,td,th {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 9px;
}
-->
</style></HEAD>
<BODY LEFTMARGIN=0 TOPMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0>
<div align="center">
<p>
<!-- ImageReady Slices (Untitled-1) -->
</p>
<p> </p>
<p> </p>
<TABLE WIDTH=150 BORDER=0 CELLPADDING=0 CELLSPACING=0>
<TR>
<TD COLSPAN=9>
<IMG SRC="images/index_01.gif" WIDTH=150 HEIGHT=15 ALT=""></TD>
</TR>
<TR>
<TD ROWSPAN=4>
<IMG SRC="images/index_02.gif" WIDTH=5 HEIGHT=135 ALT=""></TD>
<TD COLSPAN=3>
<IMG SRC="images/index_03.gif" WIDTH=69 HEIGHT=34 ALT=""></TD>
<TD ROWSPAN=4>
<IMG SRC="images/index_04.gif" WIDTH=3 HEIGHT=135 ALT=""></TD>
<TD COLSPAN=3>
<IMG SRC="images/index_05.gif" WIDTH=69 HEIGHT=34 ALT=""></TD>
<TD ROWSPAN=4> </TD>
</TR>
<TR>
<TD background="images/index_07.gif" width="5" height=100%></TD>
<TD background="images/index_08.gif" width=59>Hey</TD>
<TD background="images/index_09.gif" width="5" height=100%></TD>
<TD background="images/index_10.gif" width="5" height=100%></TD>
<TD background="images/index_11.gif" width="59">The content goes here and the box should expand to the size of your content. Ok, whilst we wait I'll tell you about me, I am called Myke and I enjoy web designing :] It's great fun, I could die for it, I'd like to thanks FallenAsh and Joe .C. they have both helped me greatly. Right, let's check has it expanded yet?</TD>
<TD background="images/index_12.gif" width="5" height=100%>
<IMG SRC="images/index_12.gif" WIDTH=5 HEIGHT=81 ALT=""></TD>
</TR>
<TR>
<TD COLSPAN=3>
<IMG SRC="images/index_13.gif" WIDTH=69 HEIGHT=5 ALT=""></TD>
<TD COLSPAN=3>
<IMG SRC="images/index_14.gif" WIDTH=69 HEIGHT=5 ALT=""></TD>
</TR>
<TR>
<TD COLSPAN=3>
<IMG SRC="images/index_15.gif" WIDTH=69 HEIGHT=15 ALT=""></TD>
<TD COLSPAN=3>
<IMG SRC="images/index_16.gif" WIDTH=69 HEIGHT=15 ALT=""></TD>
</TR>
</TABLE>
<img src="images/index_06.gif" width=4 height=135 alt="">
<!-- End ImageReady Slices -->
</div>
</BODY>
</HTML>
If you can help, + Rep will be awarded.
P.s. This layout was just a quicky.