Strip at bottom of HTML table

Printable View

05-16-2003
sean

Strip at bottom of HTML table

I'm designing my website by hand (typing the code from scratch), and I've encountered a little problem. I wanted rounded corners on page, so I got little corners of circles, put them in place, and that's all working ok. The problem is, below the bottom two corners, there is a thin strip about 5 pixels going along the bottom of the entire table. It defeats the whole purpose of having smooth corners, and I'd like to get rid of it. Is there anyway to get rid of this? I've made sure that the valign attribute is bottom, and that the height is 20, like the corners.

Code:

<HTML> <HEAD> <TITLE> Mackrory Web Design - Home </TITLE> <BASE HREF="C:\DOCUMENTS AND SETTINGS\MACKRORY WEB DESIGN\MY DOCUMENTS\MACKRORY WEB DESIGN\WWW\"> </HEAD> <BODY BGCOLOR="#000000" TEXT="#999999" LINK="#999999" ALINK="#CCCCCC" VLINK="#999999"> <TABLE ALIGN="CENTER" BORDER="0" HEIGHT="100%" WIDTH="100%" CELLPADDING="0" CELLSPACING="0"> <TR VALIGN="TOP" BGCOLOR="#333333"> <TD> <IMG SRC="GIF-BIN\TL.GIF"> </TD> <TD HEIGHT="40"> <FONT FACE="Times New Roman" SIZE="7"> Mackrory Web Design </FONT> </TD> <TD> <IMG SRC="GIF-BIN\TR.GIF"> </TD> </TR> <TR BGCOLOR="#666666"> <TD ALIGN="LEFT" NOWRAP>  </TD> <TD ALIGN="LEFT" VALIGN="TOP"> <FONT FACE="Times New Roman">  </FONT> </TD> <TD> </TD> </TR> <TR VALIGN="BOTTOM" BGCOLOR="#333333"> <TD ALIGN="LEFT"> <IMG SRC="GIF-BIN\BL.GIF"> </TD> <TD ALIGN="CENTER" HEIGHT="20"> © 2003, Sean Mackrory </TD> <TD> <IMG SRC="GIF-BIN\BR.GIF"> </TD> </TABLE> </BODY> </HTML>

The gifs are the corners (20x20 pixels). The third TD on the second row is just so that every row had equal columns.
05-16-2003
MethodMan

Id fiddle around with it to try and fix it, so can you upload the corners to a site, or here?

//Ive fooled around with it, and havent figured out anything yet, but you are missing a </tr> for that third row.
05-16-2003
OneStiffRod

I can't really see what your talking about??

maybe your talking about the black border around the whole table??

Code:

<body topmargin="0" leftmargin="0" marginwidth="0" marginheight="0" bgcolor="#FFFFFF">

Adding the bold elements to your BODY tag will solve that...
05-16-2003
OneStiffRod

Try this -- you need to change the BASE and PICS...
---------------------------
<HTML>
<HEAD>
<TITLE>
Mackrory Web Design - Home
</TITLE>
<BASE HREF="C:\Documents and Settings\Administrator\My Documents\My Pictures">
</HEAD>
<BODY BGCOLOR="#000000" TEXT="#999999" LINK="#999999" ALINK="#CCCCCC" VLINK="#999999">
<TABLE ALIGN="CENTER" BORDER="0" HEIGHT="100%" WIDTH="100%" CELLPADDING="0" CELLSPACING="0">
<TR VALIGN="TOP" BGCOLOR="#333333">
<TD>
<IMG SRC="GIF-BIN\TL.GIF">
</TD>
<TD HEIGHT="40">
<FONT FACE="Times New Roman" SIZE="7">
Mackrory Web Design
</FONT>
</TD>
<TD>
<IMG SRC="GIF-BIN\TR.GIF">
</TD>
</TR>
<TR BGCOLOR="#666666">
<TD ALIGN="LEFT" NOWRAP>

</TD>
<TD ALIGN="LEFT" VALIGN="TOP">
<FONT FACE="Times New Roman">

</FONT>
</TD>
<TD>

</TD>
</TR>
<TR VALIGN="BOTTOM" BGCOLOR="#333333">
<TD height="20" VALIGN="BOTTOM" ALIGN="LEFT">
<IMG height="28" SRC="My Pictures/cornerober copy.gif">
</TD>
<TD height="20" ALIGN="CENTER">
© 2003, Sean Mackrory
</TD>
<TD VALIGN="BOTTOM" HEIGHT="20">
<IMG height="28" SRC="My Pictures/cornerober copy.gif">
</TD>
</tr>
</TABLE>
</BODY>
</HTML>

------------------------------
05-16-2003
sean

No - I wanted the black border. Go to www.mackrory.com. The thing I want to get rid of is the little darker-gray strip below the Copyright notice.
05-16-2003
XSquared

You're locally linking to the corner images. They aren't actually on the site. Change your links to point to images on the site, not on the hard-drive.
05-16-2003
sean

Not the dumb freewebs ad - it's just a temp. host - I mean the dark strip immediately below the circles (just in case there was any confusion)
05-16-2003
sean

XSQUARED - Sorry - I forgot to change that when I uploaded it. I've been doing everything offline up until now. I just uploaded it so you guys could see what I was talking about. I'll fix it - just a sec.
05-16-2003
XSquared

Just remove the newline between the IMG tag and the closing TD tag. With IE, that always adds some space to the bottom of the image.

Code:

<IMG SRC="BL000000.gif"> </TD> Becomes... <IMG SRC="BL000000.gif"></TD>
05-17-2003
sean

Ay?

YOu've served your country well - I suddenly have a great deal of respect for Canadians... well... almost....

Thanks buddy.