Låse elementer på siden

[Jens_olaf]

Hei!

 

Jeg holder på med en internettside, og opplever da et litt irriterende problem.

Elemtenter på siden, som for eksempel en login-boks, flytter seg i forhold til resten

av innholdet på siden, alt etter hvilken skjermoppløsning man har.

Hvordan låser jeg posisjonen dens?

 

Takk for svar:)

[Haraldson]

Kan vi få en lenke til siden?

 

Det er umulig å si noe mer før jeg vet hvordan du har kodet det.

[Per Kristian]

Ideelt sett bør siden din lages slik at den tilpasses ulike oppløsninger. Se for eksempel hvor fint Gmail tilpasser seg siden din dersom du justerer størrelsen på nettleservinduet ditt.

 

Men: Det finnes en løsning på ditt problem. Teksten i eksempelet nedenfor vil ALLTID være plassert 100 piksler fra toppen av siden og 100 piksler fra venstre siden:

 

<div style="position: absolute; top: 100px; left: 100px">
Hello World!
</div>

 

Du bør imidlertid bruke den forsiktig, og det er ikke alltid absolutt-posisjonering er mulig over hodet. La oss si at siden din inneholder artikler i ulike lengder, og på bunnen av artikkelen skal det være et absolutt-posisjonert bilde. Du får dermed problemer ettersom du ikke aner hvor langt nede på siden bildet skal være uten å vite eksakt hvor lang teksten er. Du kan dermed risikere at bildet havner midt oppå teksten.

 

Gode nettsider bruker absolutt-posisjonering svært forsiktig (f.eks. en logo som alltid skal være øverst i høyre hjørnet).

[Haraldson]

Du bør imidlertid bruke den forsiktig, og det er ikke alltid absolutt-posisjonering er mulig over hodet. La oss si at siden din inneholder artikler i ulike lengder, og på bunnen av artikkelen skal det være et absolutt-posisjonert bilde. Du får dermed problemer ettersom du ikke aner hvor langt nede på siden bildet skal være uten å vite eksakt hvor lang teksten er. Du kan dermed risikere at bildet havner midt oppå teksten.

Enkelt å løse om du vet høyden på elementet du posisjonerer i bunnen, ved hjelp av position: relative på et element som omslutter både artikkelen og elementet som skal posisjoneres, samt padding-/margin-bottom på artikkelen tilsvarende høyden på elementet som skal posisjoneres.

 

Gode nettsider bruker absolutt-posisjonering svært forsiktig (f.eks. en logo som alltid skal være øverst i høyre hjørnet).

Forsiktig og forsiktig. Vet du ikke hva du holder på med er det bare å gi opp. Kjenner en til forholdet mellom relative og absolute positioning kan positioning brukes i svært mange tilfeller, og en slipper masse stress som en ville ha støtt på om en skulle tviholde på floating.