Sent by Blake on 31 March 2008 23:11
Hi List,
I'm currently having a problem in IE with a fieldset that has some
whacky behavior as far as spacing is concerned. You can find a picture
of the bug here:
http://img380.imageshack.us/my.php?image=fieldsetbugfh1.gif
The relevent HTML and CSS is:
<li>
<label for="name">First Name</label>
<input id="name" name="name" type="text" />
</li>
<li>
<fieldset class="radio">
<legend>
<span>Preferred Contact</span>
</legend>
<input id="contact_home" name="contact" type="radio" />
<label for="contact_home">Home Phone</label>
<input id="contact_mobile" name="contact" type="radio" />
<label for="contact_mobile">Mobile</label>
</fieldset>
</li>
li { clear: left; line-height: 2em; /* 22px */ padding: 5px 0 5px
140px; width: 361px; }
label { background: url(../images/myhg/contact_form_arrow.gif) 0 9px
no-repeat; color: #6D6A59; float: left; font-weight: bold;
margin-left: -140px; margin-top: -1px; padding-left: 10px; width:
120px; }
input { padding: 1px 0; }
input, textarea { width: 243px; }
fieldset { border: 0; }
fieldset span { background: url(../images/myhg/contact_form_arrow.gif)
0 9px no-repeat; color: #6D6A59; display: block; float: left;
font-weight: bold; margin-left: -140px; margin-top: -1px;
padding-left: 10px; position: relative; width: 120px; }
..radio input,
..checkbox input { width: auto; }
..radio label,
..checkbox label { background: transparent; float: none; font-weight:
normal; margin: 0; padding: 0; width: auto; }
Thanks for your help guys, this one really has me stumped.
Regards,
Blake
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
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/
