CSS Cross Browser Minimihöjd Hack
Inlägg IE 6 har MSIE varit vänlig nog att vi UI utvecklare genom att lägga till några fler CSS-egenskaper standard för de flesta andra vanliga webbläsare. En sådan användbar egenskap i "min-höjd". Ganska rakt fram fastigheter som behöver ingen lång omständlig förklaring. När en min-höjd för en division är inställd, det alltid behåller den uppsättningen höjd när det innehåll som husen upptar mindre än den kan hålla och allt (till skillnad från plain vanilla "höjd" egendom) skalor eller CSS ord, beter det som en delningen vilkas "höjd" är inställd på "auto" ...
För vissa av oss stackars utvecklare som fortfarande krävs för att koda CSS som också måste arbeta i IE6, kan un-tillgängligheten av "min-höjd", visar en show propp någon gång ... inte apparaten förtvivlan.
Lyckligtvis har vi tillräckligt med egenheter i IE, att vi skulle använda för att reda fördel och hacka oss igenom för att nå vårt mål ... dvs göra en DIVISION division som om den min-höjd i IE6
Lösning 1: Använda understreck Hack [ ... Läs mer ]
.box1 {
min-height: 200px;
height:auto;
_height:200px;
}HTML: -
<div class="box1">Some dynamic content with variable height ...</div>
Lösning 2: Använda CSS attribut Selector Hack
.box2 {
min-height:200px;
height:200px;
}
div[class] .box2 {
height:auto;
}
HTML: -
<div class="someclass">
<div class="box2 common">Some dynamic content with variable height ...</div>
</div>
CSS attribut Selector Hack drar fördel av det faktum webbläsarna tidigare tha IE6 ignoreras en atribute-väljare. Observera kravet på en annan behållare division med class = "someclass". Bara presense i klassen attributet för denna uppdelning, åsidosätter höjden tillbaka till auto för Opera, Mozilla och MSIE7 och senare. IE6, som inte stöder atribute väljare, ignorerar det.
Visa demo av min höjd hack för IE6










































