Forum PHP.pl > [CSS] Sprites nie działa poprawnie

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [CSS] Sprites nie działa poprawnie

adam882

16.11.2011, 23:21:53

Witam

Próbuję przygotować podświetlane menu w nawigacji za pomocą pociętego, zaokrąglonego tła (jako alternatywe dla border-radius, którego nie obsługuje IE). Problem jest taki, że pod firefoxem, operą wszystko wygląda w porządku, jednak w IE widać jakby obrazki pobierane ze "sprites" były z lekka rozmazane, co wygląda wręcz jakby np. z lewej części był koło obrazka dodatkowy border 1px. Próbowałem w formatach bmp, gif, jpeg i nadal to samo.

Kostek.88

17.11.2011, 02:01:49

Pokaz kod

adam882

17.11.2011, 09:13:14

Mam przykładowo taki kod (użyty obrazek - link do obrazka)

[HTML] pobierz, plaintext 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
<title>Nawigacja</title>
<style>
body{background-color:#896F85;}
 
ul li{float:left; margin-left:20px; font-weight:bold; font-size:11px; list-style:none; height:27px;}
ul li.una a{color:#eeeeee; display:block; padding:8px; text-decoration:none;}
ul li.now a{color:#82677E; display:block;  padding:8px; text-decoration:none;  background: url('btlo.gif') -227px -27px no-repeat;}
ul li.una a:hover{background-color:#FFFFFF; color:#82677E; background:url('btlo.gif') -227px -27px no-repeat;}
 
ul li, ul li.una:hover{background:url('btlo.gif') 100% 0px;}
ul li.una{background:none;}
</style>
</head>
<body>
<div style="margin:auto; padding-top:10px;">
<ul>
	<li class="now"><a href="#">Link</a></li>
	<li class="una"><a href="#">Link</a></li>
	<li class="una"><a href="#">Link</a></li>
	<li class="una"><a href="#">Link</a></li>
</ul>
</div>
</body>
</html>
[HTML] pobierz, plaintext

Pod firefoxem i operą jest wszystko ok, natomiast w IE widać buttony postrzępione i rozmyte na krawędziach. Może coś przekręciłem, gdyż css nie jest moją mocną stroną, ale kombinowałem żeby coś z tego wyszło.

by_ikar

17.11.2011, 10:13:43

U mnie pod IE 7 wszystko ok, niestety nie sprawdzę ci pod IE 6.

adam882

17.11.2011, 10:21:10

sprawdzałem pod IE 8 na innym komputerze i jest ok, natomiast na moim komputerze (IE 9) jest rozmazane. Może problem leży gdzie indziej, gdyż np. na Allegro , górny pasek pod IE również jest rozmazany - dziwne..

edit:
już wiem co było nie tak, IE powiększał mi stronę (widocznie kiedyś użyłem przez przypadek CTRL + scroll myszki)

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.