mali (velliki) problem sa div tagovima
Nadam se da cu uspeti da objasnim problem.
Uradio sam graficki dizajn u Photoshopu, isekao i izvezao kao html. Onda u Dreamwieveru dopunjavao stranicu. Ubacivao sam tekst pomocu layer-a. I sada u tim div tagovima otkucam tekst i namestim ih tamo gde zelim da budu. Kad sve to snimim i pregledam u 1024x768 u IE lepo izgleda, tekst je tamo gde je bio i u DW. E kad promenim rezoluciju npr na vecu tekst (layer) se pomeri i nije tamo gde treba, ode levo ili desno u odnosu na zeljeno mesto na strani. Kako da podesim a da mi layer bude gde jeste u bilo kojoj rezoluciji. Pitajte ako nesto nisam razumno napisao |
Postavi problematičan kôd.
Ali sve mi se čini da se radi o apsolutno pozicioniranom div-u. Otvori kôd i ručno postavi div elemente tamo gde želiš, nemoj se previše oslanjati na DW. |
OK evo koda.
<div id="Layer6" style="position:absolute; left:174px; top:258px; width:163px; height:458px; z-index:6; background-color: #95B380; layer-background-color: #95B380; border: 1px none #000000; padding: 6;"> Da li to znaci da u code modu treba da rucno podesavam za svaki layer posebno. To mi je mnogo posla postoji valjda neka opcija preko design moda u DW. |
pa problem je sto pozicioniras absolutno layere u odnosu na ekran, a verovatno ti je ostatak sadraja namesten da se pomera unaokolo (centriran ili tako nesto)
morao bi da nam das celu stranu da vidimo konkretno sta ti se pomera i zbog chega uzgred pozicije layera u DW menjas tako sto ih prevuces misem gde zelis, on sam promeni kooordinate, ako si u stvari za to pitao? |
OK evo cele strane
HTML kôd:
<html> Hvala |
Molim te, sledeci put stavi tu stranu negde pa da ljudi pogledaju source, mnogo je bolje nego da postavis source ovde jer je necitko.
|
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]> 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. |
Ovo ja zovem objasnjenjem. Kad bolje razmislim apsolutno ima smisla. Hvala na iscrpnom odgovoru. Mada kod mene i dalje nece da radi. Pokusao sam sve cak i do toga da sam kopirao tvoj kod umesto mog dela od <td> do </div> i isti problem layeri mi beze kad promenim rezoluciju.
Da nisam jos negde napravio koju gresku a da to nisi video. A jos jedno pitanje. Ako nemam celijju td kao u ovom slucaju sta ce mi onda biti parent odnosno referenca za relativno pozicioniranje. |
sto bi narod reko -> jebo objasnjenje ako stvar ne radi :)
u IE-u radi, vjerojatno ti gledas u mozilli pa ne radi. posto je tvoj container (odnosno parent) bas TD, ovaj link objasnjava zasto: http://www.quirksmode.org/css/mozilla_table.html Citat:
evo ti recimo jedan link gdje mozes na primjerima vidjet kako to izgleda bez tabela -> http://www.maxdesign.com.au/presentation/page_layouts/ |
Vreme je GMT +2. Trenutno vreme je 01:15. |
Powered by vBulletin® Verzija 3.6.8
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
Copyright © DevProTalk. All Rights Reserved.