> >> How can I align the input and select form elements in my test case,
> so
> >> that their horizontal borders are aligned and all text including
> >> labels is aligned to the baseline?
> >
> > What exactly do you want to do? Do you want the fields stacked on top
> > of each other? Then put each in a<p>  (or other block-level element
> > like<div></div>).
> >
> > <form action="Submit" method="post">
> > <p>
> >     <label>Sex<select><option value=""
> > selected="selected">Sex</option></select></label>
> > </p>
> > <p>
> >     <label>Date of Birth<input type="text" value="Date of Birth"
> /></label>
> > </p>
> > </form>

I'd use explicit labeling with "for" attributes instead of wrapping the 
controls like that.

> ... or simply unwrap the inputs from the labels and add this rule:
> 
>    label { display: block; }

Note that it would work the same without changing the markup by styling the 
controls rather than the labels

--
Regards,
Thierry
www.tjkdesign.com | www.ez-css.org | @thierrykoblentz

______________________________________________________________________
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to