आईई 7 में <dd> से पहले <dl> साफ़ करना?

Question

मैं पृष्ठ पर उपयोग किए जा रहे आइकन को परिभाषित करने के लिए <dl> बनाने का प्रयास कर रहा हूं। मुझे यह चाहिए कि हर आइकन <dt> के अंदर है और इसकी परिभाषा निम्नलिखित <dl> के अंदर है। प्रत्येक आइकन परिभाषा के बाद, मुझे एक लाइन ब्रेक चाहिए। सरल, सही? खैर, आईई 7 कहता है नहीं!

यहाँ मेरी HTML है:

 <dl style="display: block;" id="surveysIcons" class="icons"> 
      <dt class="clearfix"><span class="icon"><img alt="Complete" title="" src="images/fiq_complete.png"></span></dt> 
      <dd>You have completed the survey</dd> 

      <dt class="clearfix"><span class="icon"><img alt="Incomplete" title="" src="images/fiq_incomplete.png"></span></dt> 
      <dd>You have missed the survey</dd> 
     </dl> 

यहाँ मेरी सीएसएस है: हर <dt> पर

dl.icons { 
    margin: 0 0 1em 0; 
    padding: 0; 
    width:100%; 
    overflow:hidden; 
    line-height:24px; 
    clear: both; 
} 
dl.icons dt { 
    clear:left; 
    margin:0; 
    float:left; 
    min-height:24px; 
} 
dl.icons dd { 
    padding: 3px; 
    margin: 0 0 0 5px; 
    float:left; 
    min-height:24px; 
} 
.clearfix:after { 
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden; 
} 
.clearfix {display: inline-block;} /* for IE/Mac */ 

मेरे विधि यहाँ चल रहा है दोनों <dt> और <dd> बाईं, और समाशोधन जो, दुर्भाग्य से, आईई 7 में काम नहीं करता है।

मैंने तथाकथित जादुई clearfix की कोशिश की है, लेकिन इसका कोई फायदा नहीं हुआ है। यह फ़ायरफ़ॉक्स और आईई 8 में काम करता है।

कोई अन्य विचार जो संभवतः यह काम कर सकता है (अधिमानतः बहुत अधिक HTML को बदलने के बिना)? धन्यवाद!

Answer 1

निकालें फ्लोट: dl.icons से छोड़ दिया dd