ugrás a tartalomhoz

Link a jobb alsó sarokba

balazsgabi · 2005. Okt. 9. (V), 18.02
Üdv Mindenkinek!

A problémám lényege röviden: Két <div> két <html> oldalon, és az egyikben tudom úgy pozícionálni, h a jobb alsó sarokba a bottom és right selectorral a másiknál nem megy csak akkor ha top és left-et használok.
Ha viszont absolute pozicionálom akkor FF-ban a képernyőt (ablak) veszi alapul Opera viszont magát a <div>-et.
Van valkinek valami ötlete, h mit nem látok amiért nem úgy akarja ahogy én szeretném?

http://introduce.fw.hu/croatia/index.html és itt az ingatlan vásárlás (ahol nem megy) és az ingatlan kínálatunk (ahol müxik)
‹ Képek megjelenítése sortörés nélkül Internet Explorer, és a listaelemben lévő kép közötti felesleges margin. ›
 ■
1

<Nincs cím>

janoszen · 2005. Okt. 10. (H), 14.15
1. azok az effektek, ahol az egér mozgatását nézed, nagyon idegesitoek, szerintem szedd ki.

2. position:fixed. Csináld meg position:fixed-el és használd az IE-re való bugfixet. Akkor a link jobb oldalt alul fog maradni, még akkor is ha scrollozol.
2

köszönöm

balazsgabi · 2005. Okt. 10. (H), 17.04
az első tanácsod figyelembe véve, inkább finomítok még rajta, nekem is furcsa de a gazdának tetszik.

a másodikat meg köszönöm, de valszínű nem jól kérdeztem: Azt meg lehet oldani, h adott DIV-ben maradjon fixen és ráadásul a bottom és right selectorral?


gábor
5

Abszolut pozicionálás

janoszen · 2005. Okt. 10. (H), 21.05
Üdv!

1. Nagyon nem ajánlom ezeket az effekteket. Attól eltekintve, hogy nekem szörnyen villódzik mindegyik, nagyon komoly hozzáférhetőségi akadályokat teremtesz. Gondolkozz csak - mi van, ha valakinek "motor" tipusú akadályoztatása van? Azaz, nem tudja rendesen mozgatni az egeret. Akkor hogy tud "rácélozni" a képekre? Arról nem beszélve, hogy mondjuk engem iszonyatosan zavar, hogy a kép fölé viszem az egeret a vásárlásnál és utána nem tudom kinyomtatni vagy kimásolni a képet. Nagy minusz pont. Zavaró. Akár tetszik a gazdának, akár nem.

2. A megoldásom a következő lenne:

<div id="container">
 <div id="link">
 </div>
</div>


#container
{
 position:relative;
}

#link
{
 position:absolute;
 bottom:0px;
 right:0px;
}
A container elemnek azért kell position:relative, mert csak így lesz "igazi" blokk elem, amelyikhez a position:absolute; viszonyítja a mértékeket. Persze, nem teszteltem, mert ezt most csak fejből írtam. :)
7

bővebben

balazsgabi · 2005. Okt. 10. (H), 21.48
Először is neked is köszönöm, így kifejtve sokkal meggyőzőbb volt
...nagyon idegesitoek, szerintem szedd ki...
nél.


gábor
3

relative pozícionálás

balazsgabi · 2005. Okt. 10. (H), 19.26
Asszem nem a legtalálób címet adtam a topicnak, de a problémám valóban az, h a position:relative utasítást én úgy éretelmezem, h a szülő elemhez képest "relatív". (nem ez lenne a helyes?)

A második linknél müxik, pontosabban a szülő DIV-hez képest oda rakja ahova én terveztem.
Az első linknél pedig nem. Pontosabban csak FF-ban nem, Opera-ban igen. Gondolom valahol a CSS ben előrébb lehet a titok nyitja, csak nem látom.

gábor
4

nem

Jano · 2005. Okt. 10. (H), 20.52
A relative az önmaga eredeti helyéhez képest. Az abszolút pedig a legközelebbi pozicionált ős befoglaló paramétereihez képest!

Legközelebbi pozicionált ős: pl

<body>
 <div id="main">
  <div id="poz">
  </div>
</div>
</body>


#pos {
 position:absolute;
 bottom:0;
 right:0;
}
Ebben az esetben a body elem jobb alsó sarkához kerül.

#main {
 position:relative;
}
Ebben az esetben a main elem jobb alsó sarkához kerül.

Fontos, hogy abszolút pozicionálásnál az elem a többi elem számára úgy tünik mintha ott se lenne. Tehát a befoglaló elemnek a magasságára nem hat, az őt követő elem oda kerül ahova ő került volna és nem utána.

Relatív pozicionálásnál az elem eredeti helye megmarad csak az elemben lévő tartalom eltolásra kerül a megadott értékekkel.

Relatív pozicionálást gyakorlatban lényegében csak arra használunk, hogy az abszolút pozicionált elemhez beállítsuk mihez képest kell elhelyezni.
6

érthető

balazsgabi · 2005. Okt. 10. (H), 21.44
Köszönöm! Még számomra is világos és érthető "tutorial". El is mentettem! :)

gábor