I'm looking at the example for floating form labels at
http://www.webcredible.co.uk/user-friendly-resources/css/css-forms.shtml
and I find the labels get shifted up by a tiny amount.
In the "The original form" section the "Name" label is vertically
centered with the respect to the input box.
Under "Positioning the form with CSS" The "Name" label is shifted up
with respect to the input box (this is easier to notice when typing in
the field)
I see this in Firefox 2.0 and (more noticable) Safari 2.0.4 on a Mac.
Where does this come from; how can it be fixed?
_________________________
The HTML
_________________________
<form action="#">
<p><label for="name">Name</label> <input type="text" id="name" /></p>
<p><label for="e-mail">E-mail</label> <input type="text" id="e-mail" /></p>
<p><input type="submit" value="Submit" /></p>
</form>
_________________________
The CSS
_________________________
label
{
width: 4em;
float: left;
text-align: right;
margin-right: 0.5em;
display: block
}
.submit input
{
margin-left: 4.5em;
}
Stephan
--
Stephan Wehner
> http://stephan.sugarmotor.org
> http://stephansmap.org
> http://www.trafficlife.com
> http://www.buckmaster.ca
______________________________________________________________________
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/
