Aligning RSS icon in footer

Hi.

I suppose Graphics & Design is the best area to post about this since it's about an icon and modifying a style.

Anyways, here is a screen shot showing that I came close to accomplishing what I wanted to do:

AdminAddict

As you can see, the problem is that the bar and border is cut off around it.

Here is the original code from the style in question that I've been messing with:

Code:

<table bgcolor="#f7f7ea" width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr align="left" valign="middle"> 
<td width="52" height="47"><a href="javascript:scroll(0,0);"><img src="$stylevar[imgdir_misc]/footer_ls.gif" width="52" height="47" border="0" alt="" /></a></td>
<td width="100%" height="47" style="background-image: url($stylevar[imgdir_misc]/footer_x.gif)"><img src="$stylevar[imgdir_misc]/clear.gif" width="100%" height="47" alt="" /></td>
<td width="40" height="47"><img src="$stylevar[imgdir_misc]/footer_rs.gif" width="40" height="47" alt="" /></td>
</tr>
</table>

And here it is after I added that RSS icon:

Code:

<table bgcolor="#f7f7ea" width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr align="left" valign="middle"> 
<td width="52" height="47"><a href="javascript:scroll(0,0);"><img src="$stylevar[imgdir_misc]/footer_ls.gif" width="52" height="47" border="0" alt="" /></a></td>
<td width="100%" height="47" style="background-image: url($stylevar[imgdir_misc]/footer_x.gif)"><img src="$stylevar[imgdir_misc]/clear.gif" width="100%" height="47" alt="" /></td>
<td width="52" height="47"><a href="http://theinfinityprogram.com/external.php?type=RSS2"><img src="/enlighten/misc/forum_tool_rss.png" width="16" height="16" border="0" alt="" /></a></td>
<td width="40" height="47"><img src="$stylevar[imgdir_misc]/footer_rs.gif" width="40" height="47" alt="" /></td>
</tr>
</table>

As you can see, I'm not really knowledgeable with vBulletin coding.

Any ideas?

 

You can try adding

HTML:

<table bgcolor="#f7f7ea" width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr align="left" valign="middle"> 
<td width="52" height="47"><a href="javascript:scroll(0,0);"><img src="$stylevar[imgdir_misc]/footer_ls.gif" width="52" height="47" border="0" alt="" /></a></td>
<td width="100%" height="47" style="background-image: url($stylevar[imgdir_misc]/footer_x.gif)"><img src="$stylevar[imgdir_misc]/clear.gif" width="100%" height="47" alt="" /></td>
<td width="52" height="47"><a href="http://theinfinityprogram.com/external.php?type=RSS2"><img src="/enlighten/misc/forum_tool_rss.png" width="16" height="16" border="0" alt="" /></a></td>
<td width="40" height="47" style="float:right;"><img src="$stylevar[imgdir_misc]/footer_rs.gif" width="40" height="47" alt="" /></td>
</tr>
</table>

I don't know much HTML or CSS, but I'll try as much as possible. Maybe if it was actually there I'd be of more help. I feel useless!

 

Thanks, FMB.

Unfortunately, the "float right" command you added has no effect on the problem.

 

Or you could put the RSS icon on this image:
.

(that's the right side of the footer, same as they did wit the left side)
and make it like(Sorry!!! That's the only RSS icon I had at hand at this second):


and change the Template to:

HTML:

<table bgcolor="#f7f7ea" width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr align="left" valign="middle"> 
<td width="52" height="47"><a href="javascript:scroll(0,0);"><img src="$stylevar[imgdir_misc]/footer_ls.gif" width="52" height="47" border="0" alt="" /></a></td>
<td width="100%" height="47" style="background-image: url($stylevar[imgdir_misc]/footer_x.gif)"><img src="$stylevar[imgdir_misc]/clear.gif" width="100%" height="47" alt="" /></td>
<td width="40" height="47"><a href="http://theinfinityprogram.com/external.php?type=RSS2"><img src="$stylevar[imgdir_misc]/footer_rs.gif" width="40" height="47" alt="" /></a></td>
</tr>
</table>

 

I was actually going to ask you where you got that RSS image because it looks nice.

Once again, you're awesome. New weird problems, though:

http://www.adminaddict.net/forum/attachment.php?attachmentid=1092&stc=1&d=1262049673

A break* on the left side after the "Top" icon, and the area around the RSS icon has a thick black border.

* In fact, it looks like both the left and right broke from the rest of the bar, and are sitting lower than it.

 

Sorry for that!!!

HTML:

<table bgcolor="#f7f7ea" width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr align="left" valign="middle"> 
<td width="52" height="47"><a href="javascript:scroll(0,0);"><img src="$stylevar[imgdir_misc]/footer_ls.gif" width="52" height="47" border="0" alt="" /></a></td>
<td width="100%" height="47" style="background-image: url($stylevar[imgdir_misc]/footer_x.gif)"><img src="$stylevar[imgdir_misc]/clear.gif" width="100%" height="47" alt="" /></td>
<td width="40" height="47"><a style="border-style: none" href="http://theinfinityprogram.com/external.php?type=RSS2"><img src="$stylevar[imgdir_misc]/footer_rs.gif" width="40" height="47" alt="" /></a></td>
</tr>
</table>

Hope that works...

 

Edit this line from FMB's code:

HTML:

<td width="40" height="47"><a href="http://theinfinityprogram.com/external.php?type=RSS2"><img src="$stylevar[imgdir_misc]/footer_rs.gif" width="40" height="47" alt="" /></a></td>

...and change it to:

HTML:

     <td width="40" height="47"><a href="http://theinfinityprogram.com/external.php?type=RSS2"><img src="$stylevar[imgdir_misc]/footer_rs.gif" width="40" height="47" alt="" style="border:none" /></a></td>

That should fix the black border and thus the breaking.

Edit: This was meant to be posted before her last post. These adjustments refer to Post #4

 

Actually, that helped, Nick. Thanks. For some reason, the code FMB gave didn't have an effect. Must be how customized the style is.

Thanks again, both of you.

 

Oh! And the image was found on Iconspedia, lemme get the link.

Rss Icon | Download Pocket PNG icon | IconsPedia