Teddy Milton tastede følgende:
> Hej.
>
> mit problem ligger i at jeg ikke kan få (height) til at virke som
> det skal.
>
> hvis i kigger på hjemmesiden
http://www.temi.dk/test/
8X
Det gik lidt hurtigt - og du bør have padding : 0px med, for at
0-stille forskelligheder.
Fik lige lyst til at se lidt mere på dine koder.
du har body, html {
....
i din CSS. Fint nok - men HTML elementet har ingen style, og er altså
ganske overflødigt i denne sammenhæng.
Den med højden bliver diskuteret andetsteds, men jeg vil da godt
kommentere det her, alligevel.
Du sætter height : 100% på body.
Det er den allerede - og den kan aldrig være andet. Body'en er det du
ser i vinduet i din browser. Uanset hvad du sætter den til, bliver den
ændret efter indholdet (undtaget hvis du designer din side helt med
absolut positionerede elementer). Det eneste du reelt kan (har brug for
i hvert fald) sætte på body er margin, padding, farver og alle tekst og
font attributter. De andre er du bedre tjent med at sætte hvor de skal
bruges.
height er en "underlig størrelse", og den bliver ikke nødvendigvis
respekteret - den retter sig hellere efter det du putter i det element
du sætter height for. Igen - hvis du virkelig vil kontrollere højder,
skal du over i absolut positionering, hvor du så løber ind i problemer
med størrelser - der er ikke to personer der bruger samme størrelse
vindue på sin browser...
I stedet er det smart at gøre som du har gjort - bruge et wrapper
element (div div#side), der pakker alt det andet ind. Så har man selv
sat nogle grænser - men har ingen garanti for at det passer til den
besøgendes skærm (og 1000px er måske i overkanten, lidt afhængig af
hvad du putter i den og hvordan).
Forståelsen af margin og padding er vigtig.
Margin er afstanden til andre elementer udenom det aktuelle element.
Padding er afstanden til indholdet.
To div'er med margin 10px og padding 0px, bliver (burde blive, men
nogle browsere har svært ved det) placeret med 10px's mellemrum.
Indholdet af de to elementer, bliver altså også adskilt med 10px.
Sætter du derimod margin 0px og padding 10px på de to elementer, vil
der være 0px mellem div'erne, men 20px mellem indholdet.
Boxmodellen bruger borderen som skillelinie - også selvom der ingen
border er. Har man problemer med sit design er det ofte en god idé at
(midlertidigt) sætte en border på elementer der driller. (Eller at
bruge FF med Firebug under udvikling).
Dit problem med de 5px i toppen f.eks. Du har 0 margin, 0 padding på
både body og de to div'er du har inde i hinanden til din "overskrift".
Men du har 5px margin på overskriften. De 5px er ikke afstanden til den
div der indeholder overskriften, men afstanden til det nærmeste
element, der ikke er indeholdt i samme elementer som overskriften. Det
bliver i det her tilfælde noget udenfor body. Derfor skubbes alt
indholdet ned, så de 5px kan være ovenover det alt sammen.
Bortset fra at du bør bruge et h-element til overskriften (p står for
paragraf - altså tekstafsnit), er det rigtige her at sætte de 5px som
padding på det element der indeholder overskriften - altså div#hoved.
Alternativt, sætte 5px padding på overskrift elementet. Begge vil (så
vidt jeg kan se
) give dig det du forsøger at gøre.
Birger
--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk