> Hi - I was working on a tutorial and they suggested adding 'clear: > left;' to the descendent selector below in order to remove the > problem of next label/question ( in this case: 'Rate your apartment > farming skills' ) wrapping around the float in case where the text for > the question/label before runs more than one line, as is the case with > the second label. > Although this problem is fixed, but now I am running into another > problem in that the next 'input types' ( Novice, Intermediate, and > Advanced ) are wrapping around the long text. How can I best resolve > this - thanking in advance, Naz. > > > #subForm .label { > float: left; > width: 230px; > margin-right: 10px; > text-align: right; > font-weight: bold; > clear: left; > } > > ......... > > > <form id="subForm" name="subForm" method="post" action=""> > <p><label for="name" class="label">What is your name?</label> > <input type="text" name="name" id="name" /></p> > <p><label for="email" class="label">What is your email > address? ....There's one last step for these labels. Because they're > floated to the left, if the > text runs more than one line, the question that follows will also try > to wrap around to the right.</label> /* .......SECOND LABEL */ > <input type="text" name="email" id="email" /></p> > <p><span class="label">Rate your apartment farming skills</span> > <label> > <input name="skill" type="radio" value="novice" > />Novice</label> > <label> > <input name="skill" type="radio" value="intermediate" / > >Intermediate</label> > <label> > <input name="skill" type="radio" value="advanced" > />Advanced</ > label> > </p> > > ............. > </form>
Try to you use a fieldset instead of a p to wrap the radio buttons and use clear:left on that fieldset. That you should fix your float problem as fieldsets create a new block-formatting context and will also contain the floats. Also, using fieldset is more semantic than using paragraphs for this. -- Regards, Thierry | http://www.TJKDesign.com ______________________________________________________________________ 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/