http://www.roscripts.com/PHP_login_script-143.html
for the login

I already have a server side solution using ASP rather than PHP, I need help putting together CSS which suits the style of the template.

The code I would prefer to use for the login form is:

<form action="/login/">
<input name="process" type="hidden" value="true" />

<fieldset>
<legend>Enter your Username / Password</legend>
<p><label for="username">Username:</label> <input type="text" id="name" /></p>
<p><label for="password">Password:</label> <input type="password" id="password" /></p>
<p class="submit"><input type="submit" value="Login" /></p>
</fieldset>
</form>


and for the contact form:

<form action="/contact-us/">
<input name="process" type="hidden" value="true" />

<fieldset>
<legend>Enter your details and questions / comments</legend>
<p><label for="name">Name:</label> <input type="text" id="name" /></p>
<p><label for="email">E-mail Address:</label> <input type="text" id="email" /></p>
<p><label for="comments">Questions / Comments:</label> <textarea name="comments" cols="5" rows="5"></textarea>
<p class="submit"><input type="submit" value="Send us your questions / comments" /></p>
</fieldset>

</form>

If you look at my login page you can see the problem I am having.

I have tried looking at examples on other templates and through Google but I have so far had no success in finding a suitable solution.

What I am looking for is a user friendly guide or guidance on where to begin with CSS styling.

Any input would be appreciated!

http://jeffhowden.com/code/css/forms/

@ perthmetro: Thanks for the link, its certainly given me inspiration, I'm trying to work out how to use that form.

I've noticed 2 problems

1.)The main background image caused a line through the information boxes. I deleted it from the server and it doesn't appear to make a big difference to the original template.

2.) The search box at the top of the page has moved down and left a bit and the text colour has changed.

@ gnome: Thanks, the form looks much better already! I removed the legend tag altogether as I prefered the colour of the <h2> tag.

In forms.css, under form fieldset, you can change margin: 0 0 0 0; to margin: 0 0 0 10px;, or any other amount measured by pixel, em, or % (of page width).