Autor Zpráva
Reg
Profil
#1 · Zasláno: 3. 1. 2007, 15:58:11
Odpovědět Citovat
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
#2 · Zasláno: 4. 1. 2007, 21:20:17 · Upravil/a: Tomik
Odpovědět Citovat
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
#3 · Zasláno: 4. 1. 2007, 21:59:13
Odpovědět Citovat
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
#4 · Zasláno: 5. 1. 2007, 19:14:18
Odpovědět Citovat
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
#5 · Zasláno: 5. 1. 2007, 20:01:09
Odpovědět Citovat
Hahaha, dál...
Časová prodleva: 17 let
Toto téma je uzamčeno. Odpověď nelze zaslat.

0