Autor Zpráva
Reg
Profil
Dobrý den.

Používám malé klikací ikonky za textem, pomocí nichž lze upravovat/mazat různé věci a tak. Problém je ovšem v tom, že se nezobrazí v Internet Exploreru (minimálně ne v IE 6).

Ukázka: Problém

Zdrojový kód vypadá asi takhle:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<title>Problem</title>
<style type="text/css">
body {font-size:150%;}
a.vymazat {background:url('cross.gif') no-repeat; padding-left:16px; margin-left:2px;}
a.vymazat * {display:none;}
</style>
</head>
<body>
Maecenas volutpat ligula <a class=vymazat href="#"><sup>Vymazat</sup></a>
</body>
</html>


Je to dělané tak aby to fungovalo i v případě vypnutých stylů. Ve FireFoxu a Opeře se to zobrazuje normálně:


V IE6 tam sice jakýsi odkaz je, ale obrázek se nezobrazí:



Předem děkuji za pomoc a ještě chci upozornit, že to nechci dělat jako <img... aby se to dalo měnit stylesheetem.
Tomik
Profil
Neptej se mě proč tomu tak je (je možné, že se jedná o zdokumentovanou chybu - je-li to vůbec chyba - ale já o tom nic nevím), ale funguje mi toto řešení:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<title>Problem</title>
<style type="text/css">
body {font-size:150%;}
a.vymazat {background:url('http://mydata.regsite.cz/problem/cross.gif') no-repeat; padding-left:16px; margin-left:2px;}
a.vymazat * {display:none;}
a.vymazat, a.vymazat:hover, a.vymazat:visited {text-decoration:none;}
</style>
</head>
<body>
Maecenas volutpat ligula <a class=vymazat href="#">&nbsp;<sup>Vymazat</sup></a>
</body>
</html>


Toto řešení má jen jedinou nevýhodu, máš tam pevnou mezeru navíc, ovšem na funkčnosti to neubírá, pravdou je, že to trochu "zprasí" kód, ale halt pro funkčnost i v IE je třeba sem tam něco obětovat (taková úlitba bohům)...
Reg
Profil
Nj, na to sem přišel taky ale to tam pak je zásadní problém s šířkou, popř. mezerama navíc, nevymyslel by někdo lepčí způsob?
Tomik
Profil
A co to zkusit takhle? Už je to opravdu docela prasárna, ale funguje.... ;-) BTW ten prázdnej obrázek (transparent.gif) jsem našel na googlu, stáhni si ho, a nahraj ho k sobě na server..

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<title>Problem</title>
<style type="text/css">
body {font-size:150%;}
a.vymazat {background:url('http://mydata.regsite.cz/problem/cross.gif') no-repeat; padding-left:16px; margin-left:2px;}
a.vymazat * {display:none;}

/* PRO MSIE :-) */
* html a.vymazat * {display:inline !important;}
* html a.vymazat {padding-left:0px !important;}
* html a.vymazat img {border-width:0 !important;}
* html a.vymazat {
ruby-align: expression(
this.runtimeStyle.rubyAlign = "auto",
this.innerHTML = "<img src='http://www.housing.berkeley.edu/housing/family/images/transparent .gif' style='width:16px;height:16px' title='' alt=''>"
)
}
</style>
</head>
<body>
Maecenas volutpat ligula <a class=vymazat href="#"><sup>Vymazat</sup></a>
</body>
</html>
Reg
Profil
Hahaha, dál...
Toto téma je uzamčeno. Odpověď nelze zaslat.