grouping

□Source code of the form:

<'form>
<'fieldset>
<'legend>Subscription info<'/legend>
<'label for="name">Username:<'/label>
<'input type="text" name="name" id="name" />
<'br />
<'label for="mail">E-mail:<'/label>
<'input type="text" name="mail" id="mail" />
<'br />
<'label for="address">Address:<'/label>
<'input type="text" name="address" id="address" size="40" />
<'/fieldset>
<'/form>

□Adding CSS style:

fieldset {
padding: 1em;
font:80%/1 sans-serif;
}
label {
float:left;
width:25%;
margin-right:0.5em;
padding-top:0.2em;
text-align:right;
font-weight:bold;
}

□Adding rules for fieldset and legend:

fieldset { border:1px solid green }

legend {
padding: 0.2em 0.5em;
border:1px solid green;
color:green;
font-size:90%;
text-align:right;
}


ref:
http://pixy.cz/blogg/clanky/css-fieldsetandlabels.html
http://www.d.umn.edu/is/support/Training/Online/webdesign/css.html

kw:
fieldset legend css html gourping form text
2007-06-06 22:25 : css : コメント : 0 : トラックバック : 0 :
コメントの投稿
非公開コメント

« next  ホーム  prev »

search

ad



counter


tag cloud

category cloud