CSS problem

[sstein]

Hi,

Anyone here able to help me with a CSS problem, I have a 3 column layout.

Column down the left is a list of navigation links
Middle column is the content
Right hand column is a few more navigation links, and a box that allows you to enter your email address and subscribe to a newsletter.

It all works fine until I add the newsletter form on the right, once this is added (and it has an <input..> box or submit button in it, I get a large gap to the right of the site. As a result the browser adds a horizontal scrollbar along bottom. Scroll along and it and there is nothing there.

It is not affecting the layout of the site at all, it is purely adding empty space and resulting in browser showing the bar.

Here is the html code for the right hand column:

<div id="rightsidebar">
<div id="newsletter">
<div id="login" class="boxed">
<h2 class="title">NEWSLETTER</h2>
</div>
<div id="newsletter-body">Enter email to subscribe to our Newsletter and receive free language tips.
<br/>
<form name="mailform" method="post" action="jmail3.asp">
<input name="email" type="text" /><br />
<input name="email_submit" type="submit" id="email_submit" value="Subscribe" />
</form>
</div>
</div>
<br/>
<div id="right-menu">
<ul>
<li><a href="additionalservices.htm" title="">Additional Services</a></li>
<li><a href="sightseeing.htm" title="">Sightseeing Tours</a></li>
<li><a href="pgcoaching.htm" title="">PG Coaching</a></li>
</ul>
</div>
</div>

and here is the CSS code for the newsletter.

1. rightsidebar

{
float: right;
width: 150px;
padding-left: 0px;
padding-right: 0px;
background: #FFFFFF;
}

1. newsletter

{
background: #FFFFFF;
width: 150px;
padding-right: 0px
}

1. newsletter-top

{
background: #6e5a59;
font-weight: bolder;
font-family: Tahoma, "Gill Sans MT";
color: #FFFFFF;
padding: 2px 5px;
}

1. newsletter-body

{
padding: 2px 5px;
text-decoration: none;
color: #FFFFFF;
background: #ce4236;
font-family: Tahoma, "Gill Sans MT";
font-weight: bolder;
color: #FFFFFF;
font-size: 10px;
width: 140px;
}

1. newsletter input

{
width: 126px;
padding: 0 0 0 0;
margin-right: 0px;
}

If i comment out the html code within the form tags, the space disappears. It's only when a field is added to the newsletter form. I cant see why it would be doing this though!!!

-

Stuart

-

Stuart