html - design issues in IE 7 -


hi ,this html

<div style="width:220px;float:left;" id="radio_text">     <ul style="width:20px;float:left;display:block;">         <li style="list-style:none;line-height:13px;height:13px;float:left;"><input type="radio" name="radio_flag" checked="true" /></li>         <li style="list-style:none;line-height:13px;height:13px;float:left;"><input type="radio" name="radio_flag" /></li>         <li style="list-style:none;line-height:13px;height:13px;float:left;"><input type="radio" name="radio_flag" /></li>     </ul>     <ul style="width:200px;float:left;">         <li style="list-style:none;line-height:13px;height:13px;width: 200px;float:left;">show all</li>         <li style="list-style:none;line-height:13px;height:13px;width: 200px;float:left;">show members</li>         <li style="list-style:none;line-height:13px;height:13px;width: 200px;float:left;">show accepted contacts</li>     </ul> </div> 

my css

#radio_text ul{float:left;} #radio_text ul li{background: none;border:none;color: #000000;float: left;font-family: arial,helvetica,sans-serif;font-size: 11px;font-weight: normal;margin-right: 2px;padding: 1px 7px;text-align: left;} 

and outputs

enter image description here

please me show in ie 7

thanks

i don't know exact situation programming, byt why wouldn't change html :

<div style="width:220px;float:left;" id="radio_text">     <ul style="float:left;display:block;">         <li style="list-style:none;line-height:13px;height:13px;">             <input type="radio" name="radio_flag" checked="true" />             <span class="radio-text">show all</span>         </li>         <li style="list-style:none;line-height:13px;height:13px;">             <input type="radio" name="radio_flag" />             <span class="radio-text">show members</span>         </li>         <li style="list-style:none;line-height:13px;height:13px;">             <input type="radio" name="radio_flag" />             <span class="radio-text">show accepted contacts</span>         </li>     </ul> </div> 

this way, text automatically next radio button. wrap <label> tag around radio button , span, radio button gets checked when user clicks on text.

<label><input type="radio" name="rbtn"/><span>text</span></label>

and agree, best place style attributes in external stylesheet.


Comments

Popular posts from this blog

Javascript line number mapping -

c# - Is it possible to remove an existing registration from Autofac container builder? -

php - Mysql PK and FK char(36) vs int(10) -