Forms display

Topic:	Forms display
Lobos Professional Posts: 1588 Posted: 6.Apr 2006 - 23:16	Over the years I have hated the amount of HTML needed to display forms nicely and have always tried to cut down on the html/css needed. The code below is basically the latest incarnation of my efforts and I hope you find it useful - basically it gives a border to the form with lable on the left(aligned) and input on the right(aligned): Code <style> /to fix ie framset bug/ .fsfix{border:0;padding:0;margin:0;} .tar{text-align:right;} .fl{float:left;} </style> <form action="index.php" method="get"> <input type="hidden" name="name" value="cmscart" /> <input type="hidden" name="type" value="admin" /> <fieldset><legend><strong><!--[pnml name=NVC_IMGSETTINGS]--></strong></legend> <fieldset class="fsfix"><legend></legend></fieldset> <div class="tar"> <span class="fl"><label for="enable"><!--[pnml name=NVC_WMENABLE]--></label></span> <span><input name="enable" type="text" value="<!--[$wmdata.enable]-->" /></span> </div> <div class="tar"> <span class="fl"><label for="enable"><!--[pnml name=NVC_WMENABLE]--></label></span> <span><input name="enable" type="text" value="<!--[$wmdata.enable]-->" /></span> </div> <div class="tar"> <span class="fl"><!--[pnml name=NVC_WMENABLE]--></label></span> <span><input name="enable" type="text" value="<!--[$wmdata.enable]-->" /></span> </div> <div class="tar"> <span class="fl"><label for="enable"><!--[pnml name=NVC_WMENABLE]--></label></span> <span><input name="enable" type="text" value="<!--[$wmdata.enable]-->" /></span> </div> <input type="submit" name="isupate" value="<!--[pnml name=NVC_UPDATE]-->"> </fieldset> </form> -Lobos -- -Lobos Professional PHP Framework Services: Concept, Development and Deployment
Slugger Professional Posts: 1185 Posted: 7.Apr 2006 - 02:22	Great job Lobos! It's worth pointing out, for novices at least, that the classes in your example must be defined elsewhere- usually in Cascading Style Sheets (CSS). The form will work without CSS definitions but no "style" will be applied to the elements. Slugger

Code

<style>
/*to fix ie framset bug*/
.fsfix{border:0;padding:0;margin:0;}

.tar{text-align:right;}
.fl{float:left;}
</style>

<form action="index.php" method="get">
<input type="hidden" name="name" value="cmscart" />
<input type="hidden" name="type" value="admin" />

<fieldset><legend><strong><!--[pnml name=NVC_IMGSETTINGS]--></strong></legend>
    <fieldset class="fsfix"><legend></legend></fieldset>
    
    <div class="tar">
    <span class="fl"><label for="enable"><!--[pnml name=NVC_WMENABLE]--></label></span>
    <span><input name="enable" type="text" value="<!--[$wmdata.enable]-->" /></span>
    </div>
    
    <div class="tar">
    <span class="fl"><label for="enable"><!--[pnml name=NVC_WMENABLE]--></label></span>
    <span><input name="enable" type="text" value="<!--[$wmdata.enable]-->" /></span>
    </div>
    
    <div class="tar">
    <span class="fl"><!--[pnml name=NVC_WMENABLE]--></label></span>
    <span><input name="enable" type="text" value="<!--[$wmdata.enable]-->" /></span>
    </div>
    
    <div class="tar">
    <span class="fl"><label for="enable"><!--[pnml name=NVC_WMENABLE]--></label></span>
    <span><input name="enable" type="text" value="<!--[$wmdata.enable]-->" /></span>
    </div>

    <input type="submit" name="isupate" value="<!--[pnml name=NVC_UPDATE]-->">  
</fieldset>
</form>