Member Avatar for cuddlers89

I dont see what ive done wrong, if i dont have the links in the curved table (just text in there) it works fine. But if i change theplain text to links it messes up. See pics. Someone please help. This is the code for the table when the links are in it.

<TABLE cellspacing=0 cellpadding=0 width="150" border="0" align="center" body style="margin:0px" bgcolor="999999">
<tr>
 
<td align="left" valign="top"><img src="top_left.gif" border="0">
</td>
<TD></TD>
<td align="right" valign="top"> <img src="top_right.gif" border="0"> </td>
</tr><tr>
<TD></TD>
<td>
 
<font face="Verdana, Arial, Helvetica, sans-serif" size="2">
 
 
<a href="chat.html">Chat</a><br>
<a href="gallery.html">Gallery</a><br>
<a href="mail.html">Email</a><br>
<a href="join.html">Join</a><br>
<a href="news.html">News</a><br>
<a href="funnyshit.html>Funny shit</a>
 
 
 
</td><td></td> </tr>
<tr>
<td align="left" valign="bottom"><img src="bottom_left.gif" border="0"></td><TD></TD>
<td align="right" valign="bottom"><img src="bottom_right.gif" border="0"></td>
</tr></table>
messedup.bmp (75.85 KB)
notmessedup.bmp (72.24 KB)
  • 3 Contributors
  • 7 Replies
  • 228 Views
  • 5 Days Discussion Span
  • Latest Post Latest Post by rixius
Member Avatar for rixius 
<table cellpadding="0" cellspacing="0" border="0" style="width: 150px; background-color: #999999;">
	<tr>
		<td style="width: 1px; text-align: left; background-color: #999999">
			<img src="topleft.gif" border="0" />
		</td>
		<td style="width: 1px; text-align: right; background-color: #999999">
			<img src="topright.gif" border="0" />
		</td>		
	</tr>
	<tr>
		<td style="text-align: center;" colspan="2" width="100%">
			<a href="chat.html">Chat</a><br />
			<a href="gallery.html">Gallery</a><br />
			<a href="mail.html">Email</a><br />
			<a href="join.html">Join</a><br />
			<a href="news.html">News</a><br />
			<a href="funnyshit.html>Funny shit</a>
		</td>
	</tr>
	<tr>
		<td style="width: 1px; text-align: left; background-color: #999999">
			<img src="bottomleft.gif" border="0" />
		</td>
		<td style="width: 1px; text-align: right; background-color: #999999">
			<img src="bottomright.gif" border="0" />
		</td>		
	</tr>
</table>

Replace your table with that, and it -should- work.

Member Avatar for cuddlers89

Still got the same problem :(

Member Avatar for cuddlers89

Ok, i nearly got it woking but there are these lines down the side of the table see pic.

Please someone look through this code and tell me what is wrong with it!!

<body bgcolor="cccccc">
<TABLE cellspacing=0 cellpadding=0 width="150" border="0" align="left" bgcolor="999999" >
<tr> 
	<td align="left" valign="top"><img src="images/top_left.gif" border="0" align="left" valign="top"></td>
	<td align="center" valign="top">&nbsp;</td>
	<td align="right" valign="top"><img src="images/top_right.gif" border="0" align="right" valign="top"></td>
</tr>
<tr> 
	<td align="left" valign="middle">&nbsp;</td>
	<td align="center" valign="middle"> <div align="left"><a href="chat.php">- 
		Chat</a><br>
		<a href="cars.php">- Cars</a><br>
		<a href="music.php">- Music</a><br>
		<a href="gallery.php">- Gallery</a><br>
		<a href="email.php">- Email</a><br>
		<a href="drug_info.php"> - Drug Info</a><br>
		<a href="graffiti.php">- Graffiti Art</a><br>
		<a href="join.php">- Join</a><br>
		<a href="news.php">- News</a></div></td>
	<td align="right" valign="middle">&nbsp;</td>
</tr>
<tr> 
	<td align="left" valign="bottom"><img src="images/bottom_left.gif" border="0" align="left" valign="bottom"></td>
	<td align="center" valign="bottom">&nbsp;</td>
	<td align="right" valign="bottom"><img src="images/bottom_right.gif" border="0" align="right" valign="bottom"></td>
</tr></table>
messedup2.bmp (109.19 KB)
Member Avatar for rixius

I'm not sure what to tell you, I don't do work with tables, they are pretty much my HTML arch-nemesis. :(

Member Avatar for Lafinboy

There are default spacing settign being applied to your images. To fix this add the following parameter to your image tags:

hspace="0"

which will set horizontal spacing between the image element and adjacent elements to 0 pixels. So the new image tags will read like:

<img src="images/top_left.gif" border="0" align="left" valign="top" hspace="0">
Member Avatar for cuddlers89

Thanks!!! Its working now. :cheesy:

Member Avatar for rixius

Thanx for the solution, Lafinboy

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.