Nefunguje mi CSS2 / CSS3 v IE
Ahoj,
potřebuji radu. Vytvářím webové stránky a v IE9 mi nefunguje nic co se týče CSS2 nebo CSS3. Jde mi o to, že na stránkách mám jeden prvek, a pokud na něj najedu myší, tak se má posunout o pár pixelů doprava. V Chromu to funguje ale v IE ne. Hledal sem všude možně, potíž je v tom, že když najdu web kde to v IE9 funguje a zkopíruji zdrojový kód, následně vložím na stránky a chci vysoušet tak to nefunguje, což podle mě nedává logiku.
Prosím pomocte
Nějak jsi zapomněl napsat, co je to za kód.
#divus{
width:200px;
height:200px;
border:1px soild #eaeaea;
background:#eaeaea;
line-height:200px;
margin-left:auto;
margin-right:auto;
margin-top:50px;
font-size:20px;
}
<div id="divus">Div Transition Effect</div>
Tohle je ten příklad z jedné stránky. V IE9 to funguje, ale pokud to vložím do svých stránek, tak to nejde :(
Tak tohle rozhodně žádné posunování nedělá. Něco ti tam chybí.
Omlouvám se, zkopírovala se mi jiná část kódu, a nevšiml jsem si toho.
Takže znovu >
<style>
.picture {
filter: grayscale(100%);
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: url(desaturate.svg#greyscale);
filter: gray;
}
.picture:hover {
filter: grayscale(0%);
-webkit-filter: grayscale(0%);
-moz-filter: grayscale(0%);
-ms-filter: grayscale(0%);
-o-filter: grayscale(0%);
filter: url(desaturate.svg#greyscale);
filter: gray;
cursor: pointer;
-webkit-transition: all 500ms ease;
-moz-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
-khtml-transition: all 500ms ease;
transition: all 500ms ease;
-webkit-transform: translate(5em,0em);
-moz-transform: translate(5em,0em);
-ms-transform: translate(5em,0em);
-o-transform: translate(5em,0em);
}
</style>
<div class="picture" style="position: absolute; top: 0px; left: 300px;">
<a href="???"><img src="image/yellow.png" width="400"></a>
</div>
Mně to funguje.
No to je super :/ .. to říkám že to nedává logiku, nevím proč mě to nejde.
Kde ty stránky máš?
Momentálně nikde, zatím jenom v počítači.
Máš správně nastavený doctype?
Doufám >> <!doctype html>
A máš ten kód validní? Protože pokud by byl nevalidní, tak by se IE mohl přepnout do jiného zobrazovacího módu.
Tak to nevím, popravdě nejsem úplnej odborník na vytváření stránek. Jak to zjistím ?
Dej sem kompletní kód.
<style>
.picture {
filter: grayscale(100%);
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: url(desaturate.svg#greyscale);
filter: gray;
}
.picture:hover {
filter: grayscale(0%);
-webkit-filter: grayscale(0%);
-moz-filter: grayscale(0%);
-ms-filter: grayscale(0%);
-o-filter: grayscale(0%);
filter: url(desaturate.svg#greyscale);
filter: gray;
cursor: pointer;
-webkit-transition: all 500ms ease;
-moz-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
-khtml-transition: all 500ms ease;
transition: all 500ms ease;
-webkit-transform: translate(5em,0em);
-moz-transform: translate(5em,0em);
-ms-transform: translate(5em,0em);
-o-transform: translate(5em,0em);
}
</style>
<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title></title>
</head>
<body>
<div class="picture" style="position: absolute; top: 0px; left: 0px;z-index: 4;">
<a href="???"><img src="image/vermogen-fantasy.png" width="400"></a>
</div>
<div class="picture" style="position: absolute; top: 0px; left: 100px; z-index: 3;">
<a href="???"><img src="image/destruction.png" width="400"></a>
</div>
<div class="picture" style="position: absolute; top: 0px; left: 200px;z-index: 2;">
<a href="???"><img src="image/red.png" width="400"></a>
</div>
<div class="picture" style="position: absolute; top: 0px; left: 300px;">
<a href="???"><img src="image/yellow.png" width="400"></a>
</div>
</body>
</html>
Nemůžeš mít <style> před <doctype>. Styly bys měl mít uvnitř <head>.
Oh děkuju ti
Už to funguje ! :) Strašně moc díky, tohle by mě nikdy nenapadlo a už si dám pozor. Ještě jednou díííky 