hey all,

This is something I'm working on,

http://dev.r8dhex.net/stuff/sample1.htm

Long story short, this is for a web-application, target browsers is FF/IE6+.
My goal is to have a variety of form-controls that look good in different
configurations, and different resolutions. I'd also like the inputs to
expand when there is enough space. I'm trying to move away from table-based
designs, since this will eventually be server-generated, and it will be
easier if each label/input pair is sufficiently encapsulated.

We used to have a 2-column table-based layout with fixed-size inputs
depending on whether we need full-width or half-width, but if a user has a
hi-res screen, the inputs spread out and leave big spaces in between. I
tried using percentages, but then the inputs don't align properly along the
right-side.

Anyway, I'm pretty happy with this version, but there are still some bugs
that I can't fix. I'd like half-width to be really 50%, and full should be
100%, but IE has different ideas on what 100% means. IE also has problems
aligning the right side of the inputs, I'd like the right side of the
full-width input to line-up with the right-side of the 2nd-column inputs.
The select doesn't line up properly as well. Right now it can't handle
longer labels. It would also be better if the form would switch to 1-column
layout if the inputs go below a certain width.

I'd appreciate any feedback good or bad, whether my idea is sound, or how I
can improve this, or another approach to the problem. Maybe there's an
obscure css property that magically does what I need, and works in my target
browsers :).

Thanks
Jonathan
______________________________________________________________________
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/

Reply via email to