Centerad

Hej alla!

Undrar över en sak. Det är så att jag vill få min bild centrerad på hemsidan både på bredden och längden.

Hur får jag det till så?

Se bild exempel:

tack för hjälpen! :)

Ingen som vet? :P

För horisontell centrering är det bara att sätta höger/vänster marginaler till auto i din css.

img.bilden {display: block; margin: auto}

För vertikal centrering är det lite klurigare. Som jag minns så finns det inget attribut i CSS2 att bestämma den vertikala positioneringen. Så du måste sätta ditt innehåll inuti en behållare som sen behandlas likt en tabell.

Alltså:

div.behallaren {top: 0; left: 0; width: 100%; height: 100%; position: fixed; [B]display: table[/B]}
p {[B]display: table-cell[/B]; [B]vertical-align: middle[/B]}

Sen är det bara i din HTML att anropa sakerna rätt:

<div class="behallaren">
  <p>I mitten. Korrekt eller inte
  <img class="bilden" src="xxx" alt="I mitten!">
</div>

Men det var ett tag sedan jag gjorde sidor och skulle stoppa saker i mitten. Så det kanske finns smidigare och bättre lösningar, resten av forumet kan kanske fylla på.

RED: Justja, annars är det väl bara att sätta bildens top/left-positionsattribut till 50% och top/left-marginaler till hälften av bildens storlek. Men det kanske är en ännu fulare lösning.

Flyttas från Webbutveckling - Övrigt

syd:
Stort tack, ska se efter om det funkar sådär. :)