Boots.com is one of the most 'formsy' web sites out there. I suggest you sign up for it and try to see what has been done there. It's not bad and it will give insight into today's commercial needs from clients regarding forms. Hope that helps as a concrete example. Regards.
On Fri, Oct 17, 2008 at 9:22 PM, tee <[EMAIL PROTECTED]> wrote: > > On Oct 17, 2008, at 9:50 AM, [EMAIL PROTECTED] wrote: > >> >> That's my next bone to pick, and why I really liked the <label> wrapper. >> I really dislike the idea of wrapping the <label> & <input> in a <div> but >> I will likely have to for the exact point you have made. I need lots of >> flexibility but want minimal code bloat. Here's a simplified version of >> where I am heading: >> ... >> <fieldset class="parent" id="address"> >> >> <legend><span>Contact Information</span></legend> >> >> <div class="nameFirst"> >> <label for="nameFirst">Name</label> >> <input id="nameFirst" type="text"> >> </div> >> >> <div class="nameLast"> >> <label for="nameLast">Name</label> >> <input id="nameLast" type="text"> >> </div> >> >> >> </fieldset> >> ... >> >> Why the <span> in the <fieldset>? I may potentially need to style that >> area as a sliding doors tab, plus it seems easier to achieve consistent >> cross-browser styles on the span as opposed to the <legend>. >> >> The nested <fieldset> is to allow for the DOB to me horizontal if/when >> desired. Still lots to do regarding other form elements...more questions as >> I progress. I will also post an example. >> >> Thanks thus far! >> >> > > I have an obsession with web form styling - I cannot stand ugly web form > :-) > > So here is my two cents: if you want consistent cross-browser web form that > looks nice. Add class in the input instead, especially when it involves > using checkboxes, radio button, borders for input field, select and > multiselect. Though you can utilize input ID, but for a web form, or various > forms used throughout entire site that have many checkboxes, radio buttons > and select options, using class will be a lot clearer for your style sheet > and no need for extra div to wrap up each form element. > > Fieldset, label and input tags are enough for basic and nice styling, no > extra div needed. > <fieldset> > <legend><span>Contact Information</span></legend> > <label for=" "> xyz</label> > <input id=" " type="checkbox" class="add-a-class" > > </fieldset> > > That is for the site I have full control and know I will be the only one > updating the site. But if I make a template and the targeted users are > people who want to build their sites, then definitely bloated divs to > prevent customer service nightmare. I will even eliminate <legend> with a > clear conscious. Alas! IE and Opera are not kind to form elements. > > tee > > > > > ******************************************************************* > List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm > Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm > Help: [EMAIL PROTECTED] > ******************************************************************* > > -- Jason Grant BSc, MSc CEO, Flexewebs Ltd. www.flexewebs.com [EMAIL PROTECTED] +44 (0)7748 591 770 Company no.: 5587469 www.twitter.com/flexewebs www.linkedin.com/in/flexewebs ******************************************************************* List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *******************************************************************
