Internet Explorer 6: eliminere fejl af den dobbelt kant
Tirsdag, December 16, 2008 Blandt de forskellige venlige "fortolkning", at Internet Explorer 6 kan gøre med HTML / CSS, "double margin" er helt sikkert den mest kedelige og ofte. I praksis (høre, høre ...) god browser Microsoft kan - på mystisk vis - at fordoble avancer på de dele, der er flyde! Som sådan er følgende CSS, anvendt til et div med id box
- : block ;width:100px;height:100px;margin- left :100px;float: left } div # boks (display: block; width: 100px; height: 100px; margin-left: 100px; float: left)
Du får:
Hvor er n er den venstre margen på 100px! Fejlen heldigvis forekommer kun under visse omstændigheder, nemlig når marginen falder sammen med retning af float og når vores div#box er i direkte kontakt med sin container. Det betyder, at en yderligere div#box på samme linje, ikke lider på grund af problemet ville blive overladt ikke længere containeren men div#box ovenfor. Problemet er helt klart ikke er specifikke for den venstre margen, men det er spejlet, vendemanøvrer alle du har det samme problem med højre margen!
Solution
Løsningen er meget enkel: kun indsætte erklæring display:inline i vores CSS og defekten forsvinder:
- : block ;width:100px;height:100px;margin- left :100px;float: left ; div # boks (display: block; width: 100px; height: 100px; margin-left: 100px; float: left;
- } display: inline)
Indførelsen display:inline er ignoreret af alle andre browsere, og ikke fordi vi er særligt heldige at være specifik, men W3C:
... Det 'display' ignoreres, medmindre det har værdien »intet«.
