The simplest solution seems to be to remove the "float:right" and
"display:block" from the label.
label { width: 100px; text-align: right; margin-right: 10px; }
Generally, I would suggest working with the base styles as much as possible
before using floats to change the layout. By setting the float, you moved only
the labels out of the normal flow of the document. The inputs were still in
the normal flow. You could have also floated the inputs left to fix this. But
go with the normal document flow instead.
Also, there seemed to be a problem with your URL when you posted. Here is the
complete URL: http://web.asylumweb.net/FormTest.html
Regards,
Scott Povlot
----- Original Message ----
From: Steve Craig <[EMAIL PROTECTED]>
To: [email protected]
Sent: Tuesday, December 5, 2006 5:46:53 AM
Subject: [css-d] Applying CSS to forms
Hi
In an effort to get rid of some more tables and streamline my code a
bit I took a look at this page on styling forms...
http://www.webcredible.co.uk/user-friendly-resources/css/css-forms.shtml
...and everything went well until I tried to put a couple of input
fields side by side instead of vertically.
A sample page of the problem is here http://web.asylumweb.net/
FormTest.html
Anyone any ideas how I can get the surname label to sit correctly?
Thanks for any help.
========================================
Steve Craig - Asylum Interactive Ltd
Tel +44 1330 860550 Fax +44 1330 860880
========================================
http://www.asylumweb.com
Email: [EMAIL PROTECTED]
Skype: s.craig - iChat: steve.craig
========================================
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
____________________________________________________________________________________
Cheap talk?
Check out Yahoo! Messenger's low PC-to-Phone call rates.
http://voice.yahoo.com
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/