Re: [css-d] Form layout patterns
On Wed, Jan 30, 2013 at 3:51 PM, Chris Williams ch...@clwill.com wrote: With a hat tip to Phillipe, I've just started building off this model, and I love it. Nice responsive form shown in the form with left labels example. http://bradfrost.github.com/this-is-responsive/patterns.html I had been doing all tables for really tight control of forms, but this div-based approach seems to be working and allows the flexibility to do the side-by-side alignments and so on that you're mentioning. While at the same time being responsive and tolerable down to the small form factor devices. Not that I'm there/done/complete, but I'm coding it all right now and it seems to be working. HTH, Chris On 1/29/13 12:00 PM, Tom Livingston tom...@gmail.com wrote: Hello all, Do any of you have a favorite form styling/structure pattern that you always use? I am particularly looking for a layout that has labels next to form fields as opposed to above them. Also, multiple fields on one line, like 'state' and 'zip' next to each other, with respective labels, all on one line. Every time I have to do a form I usually end up doing battle with some aspect of it. Getting the above mentioned scenario all on one line, having labels vertically centered on the height of the fields next to them, etc always seems to be a stumbling block for me. It never goes smoothly. I've tried several approaches, but each seems to have a downside. Off-list replies as necessary... -- Thanks Chris __ css-discuss [css-d@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/ -- Tom Livingston | Senior Interactive Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com __ css-discuss [css-d@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/
Re: [css-d] Form layout patterns
Good Bradfrost link above. Thank you for that. Here's a question. Since the great CSS Positioning leap forward we no longer have to use nested tables for overall page layoutas did most of us during the late 1990s. But I do occasionally (still) use tables for laying out forms. As long as the tables are NOT nested inside the TD elements of a surrounding table, and as long as it's an occasional tool only, I don't see the harm. Violent prejudice against tables for layout is similar, in a way, to the way C-programmers now rail against the infamous goto statement, which is sometimes (break out of a doubly nested loop) useful and not harmful.if kept under control, and if the goto points forward a few lines of code only. So. Is table layout now a sin no matter what? Even if not nested and used only occasionally? .as for forms? On Tue, Feb 5, 2013 at 8:19 AM, Tom Livingston tom...@gmail.com wrote: On Wed, Jan 30, 2013 at 3:51 PM, Chris Williams ch...@clwill.com wrote: With a hat tip to Phillipe, I've just started building off this model, and I love it. Nice responsive form shown in the form with left labels example. http://bradfrost.github.com/this-is-responsive/patterns.html I had been doing all tables for really tight control of forms, but this div-based approach seems to be working and allows the flexibility to do the side-by-side alignments and so on that you're mentioning. While at the same time being responsive and tolerable down to the small form factor devices. Not that I'm there/done/complete, but I'm coding it all right now and it seems to be working. HTH, Chris On 1/29/13 12:00 PM, Tom Livingston tom...@gmail.com wrote: Hello all, Do any of you have a favorite form styling/structure pattern that you always use? I am particularly looking for a layout that has labels next to form fields as opposed to above them. Also, multiple fields on one line, like 'state' and 'zip' next to each other, with respective labels, all on one line. Every time I have to do a form I usually end up doing battle with some aspect of it. Getting the above mentioned scenario all on one line, having labels vertically centered on the height of the fields next to them, etc always seems to be a stumbling block for me. It never goes smoothly. I've tried several approaches, but each seems to have a downside. Off-list replies as necessary... -- Thanks Chris __ css-discuss [css-d@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/ -- Tom Livingston | Senior Interactive Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com __ css-discuss [css-d@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/ -- /* Colin (Sandy) Pittendrigh --oO0 */ __ css-discuss [css-d@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/
Re: [css-d] Form layout patterns
Colin (Sandy) Pittendrigh wrote: Violent prejudice against tables for layout is similar, in a way, to the way C-programmers now rail against the infamous goto statement, which is sometimes (break out of a doubly nested loop) useful and not harmful.if kept under control, and if the goto points forward a few lines of code only. I think you will find tnat Edsger Dijkstra's famous assertion [1] pre-dates the day that the Devil gave birth to the abomination known as C [2]. So. Is table layout now a sin no matter what? Even if not nested and used only occasionally? .as for forms? Table layouts are absolutely fine if you are presenting tabular matter. If you are not, then the primary criterion for assessing whether a table is likely to make your page inaccessible is How will it be rendered to someone using Assistive Technology ?. If it will be rendered in such a way that the semantics of your 'table' are clear, then go ahead; if it is rendered in such a way as to obscure the semantics of your 'table', then it should replaced by more accessible markup. Philip Taylor [1] 1968 : see http://www.cs.utexas.edu/users/EWD/ewd02xx/EWD215.PDF [2] 1969 -- 1973 : see http://en.wikipedia.org/wiki/C_%28programming_language%29 __ css-discuss [css-d@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/
Re: [css-d] ADMIN: Hey!
At 13:50 -0500 2/1/13, John Snippe wrote: Wow... nobody is immune from spam, eh? Sadly not-- mailing lists are vulnerable to anyone who's a registered member, whether because a spammer signs up an address to spam intentionally, or a list member's computer or webmail account gets compromised. I've unsubscribed the offending account, so I hope there won't be any more spam coming from that particular vector. For everyone else, this is probably a good time to review your account security, webmail outboxes, and virus checks in case you've also been compromised. Sorry for the noise, folks. -- Eric A. Meyer (http://meyerweb.com/eric/), List Chaperone CSS is much too interesting and elegant to be not taken seriously. -- Martina Kosloff (http://mako4css.com/) __ css-discuss [css-d@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/
Re: [css-d] Form layout patterns
On Tue, Feb 5, 2013 at 11:23 AM, Colin (Sandy) Pittendrigh sandy.pittendr...@gmail.com wrote: Good Bradfrost link above. Thank you for that. Here's a question. Since the great CSS Positioning leap forward we no longer have to use nested tables for overall page layoutas did most of us during the late 1990s. But I do occasionally (still) use tables for laying out forms. As long as the tables are NOT nested inside the TD elements of a surrounding table, and as long as it's an occasional tool only, I don't see the harm. Violent prejudice against tables for layout is similar, in a way, to the way C-programmers now rail against the infamous goto statement, which is sometimes (break out of a doubly nested loop) useful and not harmful.if kept under control, and if the goto points forward a few lines of code only. So. Is table layout now a sin no matter what? Even if not nested and used only occasionally? .as for forms? I'd have to add responsive layouts to the list of criteria for, specifically, using tables for form layout. Seems to me it would not be ideal to, for example, have labels in one td and associated field in another td, all in the same row, and then to try to change the layout for small screens. Keep 'em coming. Off-list as needed... Thanks all. -- Tom Livingston | Senior Interactive Developer | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com __ css-discuss [css-d@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/
