Jak mogę uzyskać IE8, aby zaakceptować tag CSS: before?

Mam następujący kod CSSJak mogę uzyskać IE8, aby zaakceptować tag CSS: before?

.editable:before { 
    content: url(../images/icons/icon1.png); 
    padding-right:5px; 
}

ten jest używany w połączeniu z następującym znaczników:

<span class="editable"></span>

W każdym innym błogosławionej przeglądarki świata moja ikona jest wyświetlana, ale IE8 wydaje się mieć problem z tym. Czy nie jest to pseudoelement CSS2 :before? czy nie jest to również polecenie CSS2? co daje?

Źródło

2010-03-30 William Calleja

Nie wiem o IE8, ale: przed i: po nie są obsługiwane w IE7 i poniżej. Nie wiem, czy w końcu dodali wsparcie w 8 lub nie. Jeśli upewni się, że strona nie renderuje się w emulacji IE7. – prodigitalson

Aktualizacja: źle odczytałem stronę! IE 8 obsługuje:: wcześniej z obrazami, po prostu nie działa, gdy jest w trybie zgodności IE7.

IE8 obsługuje :before, ~~lecz nie~~ a także obrazy jako treści, gdy nie jest w trybie zgodności. Kudos do @toscho do testowania!

Jak kocham quirksmode.org, co sprawia, że do czynienia z tych rzeczy co najmniej w połowie drogi do zniesienia. Ten facet zasługuje na medal!

Źródło

2010-03-30 15:05:52

Ah i jeśli dobrze pamiętam, nie można wstawić do niego kodu HTML, więc użycie jest niemożliwe ... – NibblyPig

@SLC: To jest renderowane jako tekst, tak. – ANeves

Można użyć obrazu jako tła dla generowanej treści:

<!DOCTYPE html> 
<meta charset="UTF-8"> 
<title>Generated content with an image</title> 
<style> 
p:before 
    { 
     content: ''; 
     padding: 20px; 
     background: url("css.png") center center no-repeat; 
    } 
</style> 
<p>Test</p>

działa w IE 8, Opera i Mozilla. Live-Demo.

Źródło

2010-03-30 15:34:41 fuxia

masz rację! IE8 jako IE8 obsługuje obrazy jako zawartość. Pozdrawiam, zaktualizowałem moją odpowiedź. +1. –

Właściwie powinieneś być ostrożny i przeczytać szczegóły. Aby uzyskać szczegółowe informacje, patrz this link - który stanowi

w programie Windows Internet Explorer 8, jak również nowsze wersje systemu Windows Internet Explorer w trybie IE8 Standards, tylko forma jeden średnik z ten pseudo-element jest rozpoznawany -to jest,: wcześniej. Począwszy od Windows Internet Explorer 9, pseudoelement :: before wymaga dwóch dwukropków , chociaż forma dwukropowa jest nadal rozpoznawana i zachowuje się tak samo, jak dla postaci dwukropka.

Znaczenie dla przeglądarek <IE9 - należy użyć :before i >=IE9 - należy użyć ::before

Źródło

2012-04-17 13:36:42 Tim

widząc to zaoszczędziło mi sporo czasu, IE8 nie działał dla mnie, ponieważ miałem :: –

podwójny jelita grubego było moim problemem, dzięki za heads up. Jak sprawić, by ten postęp był kompatybilny? To znaczy. używać pojedynczego dwukropka, jeśli jest on mniejszy niż IEX vs podwójny dwukropek, jeśli jest większy niż IEY? – Jacques

@Jacques pojedynczego dwukropka będzie działać tak samo dobrze w IE> = 9. Na razie trzymaj się pojedynczego dwukropka (który jest standardem CSS2.1). Tylko CSS3 rozróżnia pojedyncze i podwójne dwukropki dla pseudo selektorów i pseudoelementów. –

Podczas korzystania: before i: after, tylko uważać, aby nie używać podwójnych dwukropków (:: po - nie praca, ale: po będzie działać). Straciłem około 20 minut na to ...

Źródło

2012-10-15 12:26:17 marinbgd

Dziękuję, to jest właściwie odpowiedź, której szukałem osobiście. IE8 jest teraz dla mnie pracą. (Stupid IE8!) – philtune

Sir, uratowałeś mnie przed potencjalnie trwającą dziennie sesją debugowania, dlaczego to & $ (* # nie działałoby, podczas gdy każda tabela kompatybilności mówi, że powinna, –

, ale lepiej użyć :: before, aby nie wyświetlać nowoczesnych przeglądarek pewien, czy możesz podwoić się jak zamknij: przed, zamknij: przed {etc ... – landed

To idzie od niesamowitego przykładu Pekka ... Moje szczyty na moim projekcie były wysokie dla rzędu ... Dodałem więc dopełnienie-dno: 0px;

Na wszelki wypadek.

.icon-spinner:before { 
    content: ''; 
    padding: 15px; 
    padding-bottom: 0px; 
    background: url("css.png") no-repeat left top; 
}

Źródło

2013-09-30 15:51:04 no1uknow

Jak mogę uzyskać IE8, aby zaakceptować tag CSS: before?

Odpowiedz

Powiązane problemy