Mamy stronę internetową, która zasadniczo składa się z trzech kolumn,każdy z innym kolorem zastosowanym za pomocą gradientów liniowych. Chociaż działa to dobrze w Firefoksie i Chrome, to psuje się w IE8, np. Tło jest białe w dwóch odległych kolumnach, obraz w lewej kolumnie nie jest odpowiednio sklejony (nie jest pewien, który element CSS jest odpowiedzialny za jego złamanie). Wygląda idealnie w Chrome, ale okropnie w IE8.
Strona jest tutaj: http://clubsatcrp.com/walkingchallenge/
Każdy ma jakieś przemyślenia na temat jakiegoś rozwiązania do naprawieniaten problem, a przynajmniej sprawi, że będzie on wyglądał tak samo pod względem kolorów tła kolumny w IE8? Nie mam problemu z naprawieniem problemu, ale ponieważ jest to program korporacyjny, a nasza firma używa IE8 „to rodzaj problemu.
Oto część CSS (gradienty liniowe):
background: -webkit-linear-gradient(
left,
#c63d11,
#c63d11 33.33%,
#CD0000 33.33%,
#CD0000 66.66%,
#000000 66.66%,
#000000
);
background: -moz-linear-gradient(
left,
#c63d11,
#c63d11 33.33%,
#CD0000 33.33%,
#CD0000 66.66%,
#000000 66.66%,
#000000
);
background: -ms-linear-gradient(
left,
#c63d11,
#c63d11 33.33%,
#CD0000 33.33%,
#CD0000 66.66%,
#000000 66.66%,
#000000
);
background: -o-linear-gradient(
left,
#c63d11,
#c63d11 33.33%,
#CD0000 33.33%,
#CD0000 66.66%,
#4e9dd1 66.66%,
#4e9dd1
);
Odpowiedzi:
0 dla odpowiedzi № 1Jeśli potrzebujesz 3 kolumn o równych wysokościach nawet na IE8, możesz użyć display: table; (i *-cell).
Następnie możesz zdefiniować kolor tła na każdym z pasującym kolorem, aby mieć pewność, że jest czytelny we wszystkich okolicznościach (patrz WCAG 2.0 F24 określanie kolorów pierwszego planu bez określania kolorów tła i odwrotnie)
Skrzypce: http://jsfiddle.net/VbGap/
Renderowanie na IE6 i IE7 może być ulepszone przy bardzo niewielkim wysiłku, ale również nie zostanie renderowane.