Pruhlednost CSS vs. IE6/IE7

[xjohny]

Mam takovy drobny ale bolavy problemek s uvedenymi "kvalitnimi" prohlizeci
Kvuli pruhlednosti pozadi bunky v tabulce pouzivam nasledujici CSS kod:

background-image: url('../images/transparent.png') !important;
background-color: Transparent !important;
background-image: none;
background-color: Black;
filter: alpha(opacity=63);

Jenze oba IE maji problem, ze jakykoli text pres tuto vrstvu potrebuje byt pozicovan pomoci "position: relative;", jinak se taky vykresli pruhledny a neni pak citelny. Bohuzel toto pozicovani nemuzu pouzit, protoze (opet pouze v IE6/7) se obcas stane, ze ten text lita kdesi po strance a ne tam kde ma byt

Mate nekdo nejaky tip jak donutit text, aby nebyl pruhledny a zaroven se vyhnout relativnimu pozicovani?

[l_iNu$]

zkus styl:

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/transparent.png', sizingMethod='scale')

Vím že na jakpsátweb.cz píše že tento filtr nefunguje na pozadí, ovšem použitím sizingMethod='scale' mi to bez problému funguje.

Ale teď si nejsem přesně jistej jestli to řeší tvůj problém, je to celý styl té buňky? ty chceš docílit černé "polo" průhledné buňky?

Jinak na ty problémy bych se už vykvajznul, Internet Explorer 7 by to už měl zvládnout standardní cestou(průhledný PNG) a šestka je už pomale odepsaná.

[xjohny]

Presne tak, chci 63% cernou bunku (zbyle % je pruhlednost). Ten kousek z jakpsatweb jsem zkousel, ale to pozadi zustava cele cerne.

Bohuzel zatim podle mych statistik je to porad pul napul s IE6 a IE7. Ale taky bych se uz na to nejradsi vykaslal

[l_iNu$]

Mrkni na demo trik je nastavit objektu jednu z délek v tomhle případě šířku na (ne)štěstí IE bere danou délku jako minimální takže pokud obsah přetéká tak ho jednoduše zvětší:

background-image: url('transparent.png');
_background: none;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='transparent.png', sizingMethod='scale');
color: #fff;
_height: 10px;

[xjohny]

Diky za tip, ale bohuzel stale nejde Ona transparentnost pomoci filter:alpha; funguje, jediny problem je, ze ten text pres ni je take pruhledny.

Zatim to resim tim, ze misto standardni sede, kterou pouzivam pro celou stranku, udelam text bily a on transparentnosti zesedne.

Ale kdybys mel chut revidovat kod a css styl tak klidne muzes zkusit tu:
web: http://www.fotografico.cz/Gallery.aspx
CSS: http://www.fotografico.cz/styles/master.css

[visby]

v jednom projekte mi to fici aj s relative position(priehladna vrstva je relative a vyssia vrstva detto)... to by potom slo dat do jedneho spanu/divu, ktory budes davat do flowu stranky...

pouzivam klasiku filter: alpha...

[xjohny]

Takze testovaci metodikou jsem odhalil, ze pokud jsou ty texty pozicovany relativne, tak odskoci pouze v pripade, ze obrazek jeste neni nacten v cache IE. Jakmile se nacte, popisek odskoci dolu presne o velikost toho obrazku. Pokud potom refreshnu stranku, tak uz jsou popisky tam kde maji byt.

Delaji to oba IE6 i IE7

[visby]

pastni plz screen z toho ako to vyzera ked odskocia neviem si to predstavit...

btw: preco su popisky h3?

[xjohny]

H3 protoze jsou to nadpisy/nazvy fotek, i kdyz bych samozrejme mohl pouzit neco jineho. Myslis, ze to necemu vadi?

Prvni nacteni (bez cache)

Po stisku F5 (obrazky jsou jiz v cache)

[visby]

tagy h maju niekedy dost divne spravanie, skus pouzit span, ci sa nieco zmeni...

napada ma jedna uchylnost, kedze generujes stranku tak by to nemal byt az taky problem... umiestnit obrazok do divu alebo spanu, ktory bude mas fixnu vysku ako thumbnail, v tom pripade bude popisok umiestneny ihned... je to psycho, ale mohlo byt to fungovat

[xjohny]

Tak s <div> by to fungovalo nadherne!! Ovsem problem je ten, ze v IE potom nefunguji odkazy

Poloprůhledné pozadí takto udělat nejde, pokud vím. Jenom pozicováním. Když se ten filtr přilepí třeba na div (musí mít také fejkové rozměry 1x1), tak to sice funguje, ale pak uvnitř té oblasti nefungují odkazy. Debilní explorer.

By se z toho jeden po....
Snad na neco prijdu, ale moc diky za smerovani

[visby]

to vnutri toho divu nefunguju odkazy?

to je moc...

[xjohny]

Nakonec jsem to rozchodil!!! Posunul jsem ten DIV o uroven vys a odkazy najednou chodi

Diky moc za radu, navic to podle me vypada lepe, kdyz jsou ty popisky prilepene dole a ne na spodku obrazku.

Uff

[visby]

je to peklo tieto weby

[l_iNu$]

Myslím že Yuhů to vystihl naprosto přesně:

Debilní explorer.

Ovšem Microsoft si taky naběhnul viz odkaz níže:
http://www.microsoft.com/cze/windows...s/windowslive/

[xjohny]

Ovšem Microsoft si taky naběhnul viz odkaz níže:
http://www.microsoft.com/cze/windows...s/windowslive/

))

Mam prekvapivou zpravu, kdyz zapouzdrim obrazky (bez nadpisu) do DIVu, nepodari se mi je vertikalne ani horizontalne vycentrovat

Prosel jsem a prozkousel to, co o tom pisou na jakpsatweb i jinde, ale vysledky byly dosti sporne. A kompletne zpetne analyzovat CSS - kde co muze vadit... do toho fakt chut nemam. Necham to tak, jak to bylo puvodne a podekuju panum od MS za ty skvele produkty