Menu - překrývající se průhledné PNG

Zdravím,

mám problém s průhlednými PNG a menu.
Ne že by se mi nezobrazovaly průhledně v IE, to se v pohodě ošetří. Ale chcu udělat menu s nějakým NORMÁLNÍM kódem ... a tak jsem si na A List Apart našel něco přesně pro mne.

http://alistapart.com/articles/slidingdoors/
http://alistapart.com/articles/slidingdoors2/

Podle toho jsem se zařídil, ale mám problém, že ony jsou ty vrstvy vlastně pod sebou. A jelikož mám průhledné PNG, tak to jde poznat.

http://xhtml-css.wz.cz/

Takže bych Vás chtěl poprosit, jestli byste mi nepomohli najít nějaké řešení, aby (třeba) ta pravá část končila přesně u té levé, nebo já nevím.

Přemýšlel jsem, že by to mohlo jít přes JavaScript - zjistilo by to šířku celého LI tagu a nějak by to něco odečetlo. Tímpádem by pravá část skončila přesně u levé. Jenže JS mně moc nejde ;)



Takže už předem díky moc ;)

Ve FF se mi to zobrazuje OK. Zkus reload, třeba se ti nenačetly obrázky.

Jinak jsem trochu nepochopil, co tím myslíš ... Já řeším (obrázek z alistapart.com - ten odkaz, co jsem psal v prvím postu) toto:



To menu je udělané tak, že jsou dva obrázky. Jeden (left.png) je jen levý oblý konec, a druhý (right.png) je pravý oblý konec + to uprostřed. Samozřejmě dostatečně dlouhé pro jakýkoli text. Ale zkus si např. ve FF ve Firebugu změnit obsah jednoho LI na něco šíleně dlouhého ... chvíli tam bude ta pravá část, ale většinou (vlevo) bude prázdno. Ten pravý obrázek se prostě posunuje.

Napadlo mě, jak to řešit - klasicky obrázky, na kterých bude i text. V nich bude (s CSS vlastností display: none) HTML text s tím samým textem, co bude uvnitř obrázku - tímpádem kdo nebude mít styl, menu taky přečte. A vyřeším i problémy s centrováním (šířku přece znám).

Tohle Sliding Doors řešení je ale každopádně skvělé řešení, jen se nehodí pro ty průhledné PNG :/