[html + css] "dostosowanie" strony do przeglądarki (?), na FF jest prawie dobrze - na IE... kicha Opcje

[roobik]

Witam!
Postanowiłem się nieco "pobawić" w przezroczyste napisy na zdjęciach:

Kod

<style>
P.photo {
    FONT-SIZE: 10px; FLOAT: left; MARGIN: 1px 0px 1px 1px; POSITION: relative
}
P.photo A {
    COLOR: red
}

P.photo SPAN.box {
     WIDTH: 170px; BACKGROUND: url(OBRAZKI/tlo_gray.png); FILTER: Alpha(Opacity=10)
}


P.photo SPAN.links {
    DISPLAY: block; PADDING-TOP: 1px
}
.photo STRONG {
    DISPLAY: block; FONT-SIZE: 120%; PADDING-BOTTOM: 2px
}
.photo SPAN {
    BACKGROUND-COLOR: url(OBRAZKI/tlo_gray.png) FILTER: Alpha(Opacity=90); WIDTH: 150; HEIGHT: 35; PADDING-RIGHT: 1px; PADDING-LEFT: 0px; LEFT: 1px; PADDING-BOTTOM: 3px; BOTTOM: 3px; PADDING-TOP: 2px; POSITION: absolute
}
</style>



<TABLE width=585 border=1 align=center vAlign=top>
<tr>
<td width=180 align=center>
<DIV>
<P class=photo><A href="111"><IMG  height=130
alt=""
src="OBRAZKI/!testowy.jpg"
width=170><BR></A><SPAN class=box><A href="222"><STRONG>TYTUŁ</STRONG><BR>TEKST</A></SPAN></P>
</DIV>
</td>
</tr>
</table>

częśćjest "zapożyczona" z interii. Celem jest, by zdjęcie miało efekt taki, jaki jest właśnie na interii na stronie głównej ("Warto zobaczyć")
Czy mógłby mnie ktoś naprowadzić co mam źle, że IE tego nie widzi, a na FF i Operze jest niemal ok?

Próbowałem czegoś takiego:

Kod

<script type="text/javascript">

function _opacity(id, o) {
  var obj = document.getElementById(id).style;
  obj.MozOpacity = (o / 100); // Mozilla i FireFox
  obj.KhtmlOpacity = (o / 100); // Safari < 1.2
  obj.opacity = (o / 100); // Safari 1.2, nowszy FireFox i Mozilla
  obj.filter = "alpha(opacity=" + o + ")"; // Internet Explorer
}

</script>

ale to nic nie dało...
Pomóżcie proszę... (IMG:http://forum.php.pl/style_emoticons/default/sadsmiley02.gif)

[tommy4]

Spróbuję, choć nic nie obiecuję, bo zaraz idę film oglądać. (IMG:http://forum.php.pl/style_emoticons/default/tongue.gif)

no ja mam po prostu klase w css ustawiona:

#costam
{
opacity: 0.9;
-moz-opacity: 0.9;
-khtml-opacity: 0.9;
filter: alpha(opacity = 90);
}

Potem tylko <div id="costam">Tekst</div>

Nie wiem dokładnie o co ci chodzi z tą interią, bo ja tam nie widzę żadnych przeźroczystych tekstów. (IMG:http://forum.php.pl/style_emoticons/default/tongue.gif)

Przykład w tabeli hmm.

no możesz zrobić coś w tym stylu:

<div style="width: 200px; height: 100px; text-align: center; vertical-align: bottom; background: url('jakisobrazek.gif'); border: 1px #ff0000 solid;"><div id="costam" style="width: 200px; height: 20px; color: #ffffff; background-color: #000000;"><span>Jakiś tekst</span></div></div>

Jeśli się nie mylę powinno to wyświetlić prostokąt o wymiarach 200px na 100px z wycentrowaną treścią znajdującą się u dołu prostokątu z obrazkiem tła jakisobrazek.gif, ramką czerwoną 1px. Następnie w tym prostokącie jest drugi prostokąt o przeźroczystości 0.9 (czarny o wysokości 20px z białym tekstem) i w nim Jakiś tekst (dosłownie).

Czarny prostokąt powinien prześwitać na obrazek tła. (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)