Wie lege ich die Mindesthöhe für ein Div in IE7 fest?

Ich muss die minimale Höhe eines div einstellen. In Firefox ist alles gut, aber ich habe Probleme mit IE7 - ein ungewollter großer Platz.Wie lege ich die Mindesthöhe für ein Div in IE7 fest?

ul, il { 
    list-style: none; 
    padding: 0px; 
    margin: 0px; 
} 

    .p_block{ 
     color: #336699; 
     font-size: 14px; 
     min-height: 18px; 
    } 

<ul> 
    <li><a href="#"><div class="p_block">text</div></a></li> 
    <li><a href="#"><div class="p_block">text</div></a></li> 
    <li><a href="#"><div class="p_block">text</div></a></li> 
    <li><a href="#"><div class="p_block">text</div></a></li> 
</ul>

Seltsam, wenn ich padding: 0px; aus ul, li löschen, funktioniert alles einwandfrei. Warum?

Quelle

2010-12-07 user319854

Sie sollten darüber nachdenken, die Antwort zu ändern. – Deviljho

Verwendung dieses CSS für IE & FF

.p_block{ 
     color: #336699; 
     font-size: 14px; 
     min-height: 18px; 
     height:18px !important; 
    }

Quelle

2010-12-07 10:09:29

@Chinmayee, das Problem mit dieser Lösung ist, dass die Höhe des Elements wird Vergangenheit 18px nicht in der Lage sein, in Firefox zu wachsen und ein paar andere.

Eine gute Cross-Browser-Lösung auf min-height:

{ 
height: auto !important; 
height: 200px; 
min-height: 200px; 
}

Grundsätzlich;
Zeile # 1: die meisten modernen Browser verstehen! Wichtig, daher wird die Eigenschaft in der nächsten Zeile nicht überschrieben.

Zeile # 2: weil ältere Browser nicht wissen, wichtig, muss es eine festgelegte Höhe sein. Ältere Browser erlauben dem Element zu wachsen, es sei denn, es gibt einen Überlauf: Eigenschaftensatz.

Zeile # 3: Moderne Browser verstehen min- und! Wichtig. So verstehen moderne Browser die Höhe: auto und min-height: 200px, während ältere Browser Höhe verstehen: 200px; aber wird das Element wachsen lassen;)

Quelle

2011-02-23 22:49:10 Prof83

Ich denke, IE6 versteht, wichtig, aber nicht min-Höhe, so könnte es nicht daran arbeiten. – Muhd

@muhd, ja, aber IE wird immer noch die Höhe erweitern, wenn mehr Inhalt vorhanden ist .. (* ein weiterer Fehler, der in diesem Fall zu unseren Gunsten funktioniert *) –

leider, das bricht jQuery Fähigkeit, die Höhe des Elements mit dem zu manipulieren Funktionen .height() und .css ("height", VALUE). Es gibt einen Workaround, aber es hat eine Weile gedauert, bis ich ihn gefunden habe. Ich werde nur hier lassen: http://hungred.com/how-to/jquery-javascript-css-important/ – tmsimont

Hier ist eine Lösung, die ich lieber:

.p_block{ 
     color: #336699; 
     font-size: 14px; 
     min-height: 18px; 
}

dann für IE verwenden:

.p_block{ 
     height: 18px; 
}

IE behandelt Höhe als min-height so wird es wachsen.

Sie können IE Ziel durch eine spezifische IE6 & 7 CSS-Datei einschließlich, wie unten dargestellt (geht im < head>)

<!--[if IE 6]> 
     <link rel="stylesheet" type="text/css" href="css/ie6-hacks.css" /> 
     <script type="text/javascript"> 
      // IE6 Background Hover Flicker Fix 
      try { 
       document.execCommand('BackgroundImageCache',false,true); 
       }catch(ignoreme){ 
      } 
     </script> 
    <![endif]--> 
    <!--[if IE 7]> 
     <link rel="stylesheet" type="text/css" href="css/ie7-hacks.css" /> 
    <![endif]-->

Quelle

2012-02-11 17:09:34

Upvoted für den Kommentar "IE behandelt Höhe als Min-Höhe, so dass es wachsen wird."Prof83's Anser ist ziemlich gut –

Fräulein aus den auto height und den wichtigen und fügen * vor den height.

Dies wird dann nur auf IE7 und darunter angewendet.

.p_block{ 
    min-height: 30px; 
    *height: 30px; 
}

Es ist, was ich verwenden, IE7 wird min-height nicht verwenden, aber die height auf 30px gesetzt und wird größer sein, wenn erforderlich.

Quelle

2012-08-28 13:07:40

Wie lege ich die Mindesthöhe für ein Div in IE7 fest?

Antwort

Verwandte Themen