tesko ce ovo bit, al ajde...
prije svega, prouci malo sta je to i kako radi relativno pozicioniranje a kako apsolutno. ovo ti je najbolje mjesto za to:
http://www.w3.org/TR/CSS2/visuren.html
konkretno ->
postoji nesto sto se zove 'normal document flow', odnosno, to je nacin na koji browser cita i renderira elemente na stranici (tablice, DIVove, Pove itd itd). Elementi koji nisu pozicionirani nekom posebnom deklaracijom, naci ce se na mjestu na stranici redom kako ih browser pronalazi u kodu (ovo je pojednostavljeno receno, naravno). Medjutim, tako dobivene pozicije elemenata mogu se 'zaobici' odnosno izmijeniti. za to postoji vise nacina, a nas ovdje zanimaju dva:
- apsolutno pozicioniranje
- relativno pozicioniranje
apsolutno
kada elementu stavis atribut 'position:absolute;' onda browser to vidi kao da ne postoji u normalnom poretku elemenata vec je iz njega 'izvucen' i pozicioniran prema 'top|right|bottom|left' atributima. Pri tome, 'top|right|bottom|left' vrijednosti su odgovarajuce udaljenosti rubova tog elementa od elementa u kojem se on nalazi (odnosno, njegovog parent elementa). medjutim, da bi parent element mogao biti referenca za pozicioniranje, on sam mora biti nekako pozicioniran (relativno ili pozitivno).
relativno
pozicija relativno pozicioniranih elemenata izracunava se tako sto se prvo izracuna kao da su u normal flow-u, a na tako dobivenu poziciju dodaju se 'top|right|bottom|left' vrijednosti. drugim rijecima, 'top|right|bottom|left' u tom slucaju predstavljaju pomak u odnosu na normal flow.
razlika apsolutnog i relativnog pozicioniranja je i u ponasanju okolnih elemenata (siblings); kod apsolutnog, okolni elementi se ponasaju kao da apsolutno pozicionirani element ne postoji (drugim rijecima, ne ostaje 'rupa' na njegovom mjestu). kod relativnih, rupa ostaje.
u tvom konkretnom primjeru, radi se o slijedecem: npr. tvoj layer
id="Layer1" je apsolutno pozicioniran sto znaci da ce njegove koordinate biti odredjene vrijednostima 'top|right|bottom|left' i to u odnosu na njegov parent element (odnosno onaj u kojem se on nalazi). u ovom slucaju, to je
<td> odnosno celija tabele u koju si ga stavio. kako smo rekli, da bi neki parent element mogao biti referentan za pozicioniranje elemenata koje sadrzi, i on sam mora biti nekako pozicioniran. zato tom
<td>-u jednostavno postavis atribut
position:relative. dakle,
HTML kôd:
<td [b] style="position:relative;"[/b]>
<!-- ImageReady Slices (03.psd) -->
<div id="Layer1" style="position:absolute; left:566px; top:275px; width:175px; height:429px; z-index:1; background-color: #CCCCCC; layer-background-color: #CCCCCC; border: 1px none #000000;">
<p><font face="Myriad Pro Light Cond">Mixxx is een programma voor DJ's.
Het biedt verschillende functies die het leven van de DJ gemakkelijker
maken.a. beat esitmation, parallele displays en ondersteuning voor
een groot aantal DJ input controllers. [schermafbeeldingen] Homepage:
http://surfnet.dl.sourceforge.net</font></p>
<p><font face="Myriad Pro Light Cond">/sourceforge/mixxx/mixxx-1.4.2-win.exe</font></p>
</div>
problem je bio u tome sto nijedan element nije mogao biti referentan za apsolutnu poziciju layera1 i zato je on bio pozicioniran u odnosu na cijeli ekran (body element) pa ti se i njegova pozicija mijenjala ovisno o velicini prozora.
kada si pak njegovom parent elementu stavio position:relative, tada on postaje referenca za pozicioniranje i layer1 se 'veze' uz taj TD i vise ne klizi ovisno o velicini prozora.
naravno, ovo nije nimalo lijepo rjesenje, ali dovoljno je da ilustrira kako ove stvari rade.