Need a little help

[mrsbuzzy]

I'm modifying my website forums.

my community is http://www.parent-2-parent.com/forum
you can log in under testing with the password of testing.

When logged in you'll only see 2 boards: Towne Centre (the way all our boards currently look) and the "Testing Style" board which is in the early stages of modifications.

I'm having problems with the coding.

If you look at the 'buttons' at the top for 'boards', 'donate', 'shopping' etc... you'll see space between them as well as space below them.

I don't know why.

In my control panel under user CSS I have these settings:
Main Table Width 100%
Spacer Size 0
Outer Border Width 0
Inner Border Width 1
Table Cell Padding 2 (I tried 0 and it didn't help this problem)
Forum Element Spacer Size 0
etc..

Here's the coding I used for the Table I have the buttons and the bar below the buttons:

<table width="100%">
<tr><td>
<img src="http://www.parent-2-parent.com/image...ons/boards.jpg">
<img src="http://www.parent-2-parent.com/image...ons/donate.jpg">
<img src="http://www.parent-2-parent.com/image...s/shopping.jpg">
<img src="http://www.parent-2-parent.com/image...wristbands.jpg">
<img src="http://www.parent-2-parent.com/image...newsletter.jpg">
</td></tr>
<tr bgcolor="#F30089"><td align="center" valign="center" cellpadding="2">
<font color="#FFFFFF" size=2 align="center"><B><center>Help support Parent-2-Parent, ~ <i>Parents Supporting Parents</i></center></b></font></td>
</tr>
</table>

I want the buttons to touch and I want the buttons to sit ON the pink bar...

Anyone have any idea what I'm doing wrong?

[Hellcat]

I guess your problem is that HTML render engines treat a linebreak as a space.

Try lining up all your <IMG ... /> tags in one line of code.

So, this:

<img ... />
<img ... />
<img ... />

should look like this instead:

<img ... /><img ... /><img ... />

Also be sure not to put any spaces between the tags and just put them directely one after another.

[mrsbuzzy]

Thank you!! I used what you said and tweaked it some more and it worked!
This is the code I used... I think I was just staring at it too long.

<table width="100%" bgcolor="#F30089"><tr bgcolor="#E6EDE4"><img src="http://www.parent-2-parent.com/images/buttons/boards.jpg"><img src="http://www.parent-2-parent.com/images/buttons/donate.jpg"><img src="http://www.parent-2-parent.com/images/buttons/shopping.jpg"><img src="http://www.parent-2-parent.com/images/buttons/wristbands.jpg"><img src="http://www.parent-2-parent.com/images/buttons/newsletter.jpg"></tr><tr bgcolor="#F30089"><td align="center" valign="center" cellpadding="2"><font color="#FFFFFF" size=2 align="center"><B><center>Help support Parent-2-Parent, ~ <i>Parents Supporting Parents</i></center></b></font></td></tr></table>