/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord? 		Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
1  molokyle 11184
2  Klaudi 5506
3  bentjuul 3377
4  severino 2040
5  smorch 1950
6  strarup 1525
7  natmaden 1396
8  scootergr.. 1320
9  e.c 1150
10  miritdk 1110
CSS height fejl
Fra : Teddy Milton

Dato : 10-06-09 09:57
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/

så ser i, i IE at der mangler 5 mm af det grå i bunden, (kun hvis
i tager et af de links der er), jeg vil gerne have det til at
fylde hele højden, derfor har jeg prøvet at lave en masse D'er på
forsiden, og det virker så meldt godt nok, men de andre links
sider mangler de 5 mm for neden.

åbner du den i firefox mangler der 5 mm for oven.

har prøvet alt syntes jeg for at det skal passe, med margin
min-height, height osv.

html kilde kode:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>Temi.dk</title>
<link rel="stylesheet" type="text/css" href="style.css"/>
</head>
<body>
<div id="side">
<div id="hoved">
<p>Temi.dk</p>
</div>
<div id="links">
<center>
<a href="index.php">Forsiden</a>&nbsp;&nbsp;&nbsp;
<a href="index.php?side=mig">Lidt om mig</a>&nbsp;&nbsp;&nbsp;
<a href="index.php?side=betina">betina</a>&nbsp;&nbsp;&nbsp;
<a href="index.php?side=billeder">Kira</a>&nbsp;&nbsp;&nbsp;
<a href="index.php?side=billeder">Links</a>&nbsp;&nbsp;&nbsp;
<a href="index.php?side=billeder">Lidt billeder</a>
<a href="index.php?side=billeder"></a>
</center>
</div>
<div id="sidec">


<?php


if ($_GET['side'] == mig)
{
//indhold
?>
<div id="billedmig">
<img src="billed/mig.jpg" alt="mig" />
</div>

<p>test</p>
<?php
}

elseif ($_GET['side'] == betina)
{
?>
<div id="billedmig">
<img src="billed/betina.jpg" alt="betina" />
</div>

<p>test</p>
<?php
}
elseif ($_GET['side'] == billeder)
{
echo "hej";
}

elseif ($_GET['id'] == test)
{
   
}



else
//forsiden

{echo "Siden er under opbygning.<br />Nyheder omkring siden vil
komme her<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
/>d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
/>d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
/>d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
/>d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
/>d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
/>d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
/>d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
/>d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
/>d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
/>d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
/>d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
/>d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d"; }

?>
</div>
</div>


</body>
</html>

og min css kilde kode:
body,html {
background-color: #30b2ef;
margin-top: 0px;
height: 100%;
}


p {
color: blue;
margin: 5px 5px 5px 5px;
}

a:link {
   color: white;
   text-decoration:none;
}
a:visited {
   color: white;
   text-decoration:none;
}


div#sidec{
   float: left;
    width:1000px;
margin:0px auto;

}

div#side{
width:1000px;
margin:0px auto;
min-height: 100%;
background-color: gray;
border-right: 1px solid black;
border-left: 1px solid black;
}

div#links{
   width: 1000px;
   height: 30px;
}

div#hoved{
   height: 50px;

width: 1000px;

}

div#billedmig {
   float: left;
}

div#billedmus {}

..clb {clear:both;}




er der noget jeg gør forkert ang indlæg sig det gerne er mit
første post.

håber i kan hjælpe mig ang mit problem.

hilsen Teddy



--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

 
 
Birger Sørensen (10-06-2009)
Kommentar
Fra : Birger Sørensen

Dato : 10-06-09 10:27
Efter mange tanker skrev Teddy Milton:
> 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/
>
> så ser i, i IE at der mangler 5 mm af det grå i bunden, (kun hvis
> i tager et af de links der er), jeg vil gerne have det til at
> fylde hele højden, derfor har jeg prøvet at lave en masse D'er på
> forsiden, og det virker så meldt godt nok, men de andre links
> sider mangler de 5 mm for neden.
>
> åbner du den i firefox mangler der 5 mm for oven.
>
> har prøvet alt syntes jeg for at det skal passe, med margin
> min-height, height osv.
>
> html kilde kode:
> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
> <html>
> <head>
> <title>Temi.dk</title>
> <link rel="stylesheet" type="text/css" href="style.css"/>
> </head>
> <body>
> <div id="side">
> <div id="hoved">
> <p>Temi.dk</p>
> </div>
> <div id="links">
> <center>
> <a href="index.php">Forsiden</a>&nbsp;&nbsp;&nbsp;
> <a href="index.php?side=mig">Lidt om mig</a>&nbsp;&nbsp;&nbsp;
> <a href="index.php?side=betina">betina</a>&nbsp;&nbsp;&nbsp;
> <a href="index.php?side=billeder">Kira</a>&nbsp;&nbsp;&nbsp;
> <a href="index.php?side=billeder">Links</a>&nbsp;&nbsp;&nbsp;
> <a href="index.php?side=billeder">Lidt billeder</a>
> <a href="index.php?side=billeder"></a>
> </center>
> </div>
> <div id="sidec">
>
>
> <?php
>
>
> if ($_GET['side'] == mig)
> {
> //indhold
> ?>
> <div id="billedmig">
> <img src="billed/mig.jpg" alt="mig" />
> </div>
>
> <p>test</p>
> <?php
> }
>
> elseif ($_GET['side'] == betina)
> {
> ?>
> <div id="billedmig">
> <img src="billed/betina.jpg" alt="betina" />
> </div>
>
> <p>test</p>
> <?php
> }
> elseif ($_GET['side'] == billeder)
> {
> echo "hej";
> }
>
> elseif ($_GET['id'] == test)
> {
>    
> }
>
>
>
> else
> //forsiden
>
> {echo "Siden er under opbygning.<br />Nyheder omkring siden vil
> komme her<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
> />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
> />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
> />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
> />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
> />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
> />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
> />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
> />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
> />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
> />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
> />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br
> />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d<br />d"; }
>
> ?>
> </div>
> </div>
>
>
> </body>
> </html>
>
> og min css kilde kode:
> body,html {
> background-color: #30b2ef;
> margin-top: 0px;
> height: 100%;
> }
>
>
> p {
> color: blue;
> margin: 5px 5px 5px 5px;
> }
>
> a:link {
>    color: white;
>    text-decoration:none;
> }
> a:visited {
>    color: white;
>    text-decoration:none;
> }
>
>
> div#sidec{
>    float: left;
>     width:1000px;
> margin:0px auto;
>
> }
>
> div#side{
> width:1000px;
> margin:0px auto;
> min-height: 100%;
> background-color: gray;
> border-right: 1px solid black;
> border-left: 1px solid black;
> }
>
> div#links{
>    width: 1000px;
>    height: 30px;
> }
>
> div#hoved{
>    height: 50px;
>
> width: 1000px;
>
> }
>
> div#billedmig {
>    float: left;
> }
>
> div#billedmus {}
>
> .clb {clear:both;}
>
>
>
>
> er der noget jeg gør forkert ang indlæg sig det gerne er mit
> første post.
>
> håber i kan hjælpe mig ang mit problem.
>
> hilsen Teddy

* eller body {
margin : opx;
}

Forskellige browsere har forskellige default indstillinger.
Ovenstående fjerner forskellighederne.
Bruger du *, skal duh huske at sætte det du øsker, på alle elementer.

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk



Teddy Milton (10-06-2009)
Kommentar
Fra : Teddy Milton

Dato : 10-06-09 10:46
Birger Sørensen wrote in dk.edb.internet.webdesign.html:
> Efter mange tanker skrev Teddy Milton:
> > Hej.
> > > * eller body {
> margin : opx;
> }
>
> Forskellige browsere har forskellige default indstillinger.
> Ovenstående fjerner forskellighederne.
> Bruger du *, skal duh huske at sætte det du øsker, på alle
elementer.
>
> Birger
>
> --
> http://varmeretter.dk - billig, sund og hurtig mad
> http://bbsorensen.dk
>
>

skrev det under body, eller rettede den margin jeg havde, det hjalp i
IE, men samme fejl er der stadig i firefox, og er jo mange der bruger
firefox idag, så har du en rettelse der også?

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Birger Sørensen (10-06-2009)
Kommentar
Fra : Birger Sørensen

Dato : 10-06-09 11:22
Teddy Milton sendte dette med sin computer:
> Birger Sørensen wrote in dk.edb.internet.webdesign.html:
>> Efter mange tanker skrev Teddy Milton:
>>> Hej.
>>>> * eller body {
>> margin : opx;
>> }
>>
>> Forskellige browsere har forskellige default indstillinger.
>> Ovenstående fjerner forskellighederne.
>> Bruger du *, skal duh huske at sætte det du øsker, på alle elementer.
>>
>> Birger
>>
>> --
>> http://varmeretter.dk - billig, sund og hurtig mad
>> http://bbsorensen.dk
>>
>>
>
> skrev det under body, eller rettede den margin jeg havde, det hjalp i
> IE, men samme fejl er der stadig i firefox, og er jo mange der bruger
> firefox idag, så har du en rettelse der også?

Du har 5px margin på p- elementer. Det er de 5px der stadig er i toppen
- både IE og FF.

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk



Teddy Milton (10-06-2009)
Kommentar
Fra : Teddy Milton

Dato : 10-06-09 13:10
det hjalp.

men den grå baggrund stopper, i FF der hvor selve skærmen stopper inden du
scroller ned, gør den ikke i IE

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Birger Sørensen (10-06-2009)
Kommentar
Fra : Birger Sørensen

Dato : 10-06-09 13:16
Den 10-06-2009, skrev Teddy Milton:
> det hjalp.
>
> men den grå baggrund stopper, i FF der hvor selve skærmen stopper inden du
> scroller ned, gør den ikke i IE

Selvfølgelig. Du har sat højden til 100% - det er der hvor
skærmbilledet stopper, når du åbner siden...
Sæt overflow til hidden (eller scroll eller auto), og se forskellen B-)

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk



Teddy Milton (10-06-2009)
Kommentar
Fra : Teddy Milton

Dato : 10-06-09 13:29
Birger Sørensen wrote in dk.edb.internet.webdesign.html:
> Den 10-06-2009, skrev Teddy Milton:
> > det hjalp.
> >
> > men den grå baggrund stopper, i FF der hvor selve skærmen stopper inden du
> > scroller ned, gør den ikke i IE
>
> Selvfølgelig. Du har sat højden til 100% - det er der hvor
> skærmbilledet stopper, når du åbner siden...
> Sæt overflow til hidden (eller scroll eller auto), og se forskellen B-)
>
> Birger
>
> --
> http://varmeretter.dk - billig, sund og hurtig mad
> http://bbsorensen.dk
>
>
vil først sige tak til alle dine svar de hjælper en del, dette er sådan set min
første rigtige side, så har faktisk kun meget lidt forstand i hvad jeg laver,
ang. min overskift har jeg bare skrevet noget pga jeg vil have et billed der.
din sidste besked skrev du noget med overflod auto og scroll, gider du lave de
3 linjer så jeg bare kan copy paste dem ind hvor de burde være også kan jeg se
om det virker.

og mange tak for den lange forklaring af padding og det, var langt bedre end
nogle af de guides jeg har fundet hist og her.

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Birger Sørensen (10-06-2009)
Kommentar
Fra : Birger Sørensen

Dato : 10-06-09 14:04
Teddy Milton kom med følgende:
> Birger Sørensen wrote in dk.edb.internet.webdesign.html:
>> Den 10-06-2009, skrev Teddy Milton:
>>> det hjalp.
>>>
>>> men den grå baggrund stopper, i FF der hvor selve skærmen stopper inden du
>>> scroller ned, gør den ikke i IE
>>
>> Selvfølgelig. Du har sat højden til 100% - det er der hvor
>> skærmbilledet stopper, når du åbner siden...
>> Sæt overflow til hidden (eller scroll eller auto), og se forskellen B-)
>>
>> Birger
>>
>> --
>> http://varmeretter.dk - billig, sund og hurtig mad
>> http://bbsorensen.dk
>>
>>
> vil først sige tak til alle dine svar de hjælper en del, dette er sådan set
> min første rigtige side, så har faktisk kun meget lidt forstand i hvad jeg
> laver, ang. min overskift har jeg bare skrevet noget pga jeg vil have et
> billed der. din sidste besked skrev du noget med overflod auto og scroll,
> gider du lave de 3 linjer så jeg bare kan copy paste dem ind hvor de burde
> være også kan jeg se om det virker.
>
> og mange tak for den lange forklaring af padding og det, var langt bedre end
> nogle af de guides jeg har fundet hist og her.

Har lige prøvet - det giver ikke de reultater jeg forventede.
Og det er formentlig fordi browserne er i quirks-mode, fordi din
<!DOCTYPE...> mangler den vigtige halvdel...
Den bør være
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
gerne på een linie.
Uden at gå for meget i detallier, så er den sidste del definitionen på
doctypen, og den skal browserne bruge, for at kunne forstå din HTML.

Og det er du nødt til at rette, som det aller første.
Brug også
http://validator.w3.org/
og evt. også
http://jigsaw.w3.org/css-validator/
flittigt. Jo før man retter fejlene, jo nemmere er det.

(Din kode ligner i øvrigt delvist noget der oprindelig er skrevet i
XHTML - og det giver fejl i HTML.
Du kan godt skrive i XHTML. Det kræver lidt mere disciplin, men giver i
længeden pænere kode.
Kort så er der ingen forskel på HTML og XHTML, ud over at XHTML skal
skrives men en strengere syntax en HTML'en, og er mindre "tilgivende"
for fejl - hvis du vil det, skal du også bruge en anden <!DOCTYPE...>)

Jeg vil forslå dig at du holder dig til HTML4.01, som du vist er
begyndt.

Når du har rette de ting, er der en chance for at browserne også
forstår hvad du mener, og tingene kommer måske til at se lidt
anderledes ud.

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk



Jørgen Farum Jensen (10-06-2009)
Kommentar
Fra : Jørgen Farum Jensen

Dato : 10-06-09 10:45
Teddy Milton skrev:
> 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/
>

<snip - snip>
> er der noget jeg gør forkert ang indlæg sig det gerne er mit
> første post.

Velkommen i klubben. Når du sender et indlæg er det
alt nok at sende et link til siden. Du behøver
ikke at gengive hele sidens kode.

Dit problem løses antagelig ved at indsætte følgende
formdeklaration i dit stylesheet:

* {margin:0;padding:0;border:none;}

Det nulstiller alle marginer og al padding på alle
elementer, inklusive body-elementet. Forskellige
browsere har forskellige standarder for hvor meget luft,
der skal være omkring elementerne. Det er derfor bedst
at nulstille alt og dernæst sætte de egenskaber, man har
brug for.

En anden ting er, at jeg har utrolig svært ved at
forstå denne fascination af *højde*, uanset om
det er forsøg på at beslaglægge 100 procent af
browservinduets højde eller noget andet.

En websides højde skabes af sidens HTML-elementer
og disse elementers indhold af tekst eller billeder.
Og websidekonstruktøren har kun yderst sjældent kontrol
over, hvor meget det fylder på brugerens computer.

En god hjemmeside skabes ikke af HTML og CSS men
sidens /indhold/. Har du ikke lige fået skrevet
den gode historie, der skal bære siden, bør du
bruge noget mumletekst, når du laver sidens
visuelle struktur. Har du ikke lige noget mumle-
tekst ved hånden kan du finde noget her:
http://webdesign101.dk/cssbog/mumle.html

--

Med venlig hilsen
Jørgen Farum Jensen
Håndbog i webdesign: http://webdesign101.dk/wwwbog/udgave2/
Webdesign med stylesheets: http://webdesign101.dk/cssbog/
..

Teddy Milton (10-06-2009)
Kommentar
Fra : Teddy Milton

Dato : 10-06-09 10:53
hvis jeg smider det ind i mit css dokument, hjælper det ikke hverken,
som alene eller under body så hvor skal det hen?

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Jørgen Farum Jensen (11-06-2009)
Kommentar
Fra : Jørgen Farum Jensen

Dato : 11-06-09 21:46
Teddy Milton skrev:
> hvis jeg smider det ind i mit css dokument, hjælper det ikke hverken,
> som alene eller under body så hvor skal det hen?
>
Jge kan nu ikke se at du har brugt i din CSS-fil.
Det er der det skal være.

--
Med venlig hilsen
Jørgen Farum Jensen
http://webdesign101.dk

Anders Wegge Keller (10-06-2009)
Kommentar
Fra : Anders Wegge Keller

Dato : 10-06-09 10:58
Jørgen Farum Jensen <jfjenzen@yahoo.dk> writes:

> En anden ting er, at jeg har utrolig svært ved at forstå denne
> fascination af *højde*, uanset om det er forsøg på at beslaglægge
> 100 procent af browservinduets højde eller noget andet.

I det tilfælde hvor man har en fast footer, kan det måske være
ønskeligt udfra et ren æstetisk synspunkt at sikre sig den altid er
nederst på siden.

--
/Wegge

Anders Wegge Keller (10-06-2009)
Kommentar
Fra : Anders Wegge Keller

Dato : 10-06-09 12:12
Jørgen Farum Jensen <jfjenzen@yahoo.dk> writes:

> Men uanset om du med "nederst på siden" mener altid i bunden af
> browservinduet, eller altid under det øvrige indhold er der bedre
> metoder end at oprette et #side-element med en højde på 100 procent
> - af hvad: siden eller browservinduet?

100% af body giver ikke så meget mening :) Og 100% af viewport sikrer
at footeren altid kommer under kanten, uanset hvor lidt eller hvor
meget tekst der er, så det er heller ikke så praktisk.

Jeg har vænnet mig af med at lade mig gå på af den slags, så jeg er
helt holdt op med at spekulere i det, men hvis du har en metode til at
få placeret en <div> i bunden af viewport, eller i slutningen af
teksten, afhængig af hvor meget tekst der er, kunne det da være
interessant nok at se.

--
/Wegge

Birger Sørensen (10-06-2009)
Kommentar
Fra : Birger Sørensen

Dato : 10-06-09 13:14
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



Anders Wegge Keller (10-06-2009)
Kommentar
Fra : Anders Wegge Keller

Dato : 10-06-09 13:29
"Lisbet Overvad Laursen" <lisbet.olnospam@gmail.com> writes:

> Jeg ved ikke om det er sådan noget som det jeg har lavet her:
> http://rudholm.dk I mener? Jeg kan ikke lige huske hvordan, men det
> fremgår jo af kildekoden.

Noget i den stil. Du skal dog lige være opmærksom på at footeren
altid befinder sig under kanten af viewport, når jeg ser på det i IE7.

--
/Wegge
Søg
Reklame
Statistik
Spørgsmål : 177580
Tips : 31968
Nyheder : 719565
Indlæg : 6409081
Brugere : 218888
Månedens bedste
Årets bedste
Sidste års bedste
Copyright © 2000-2024 kandu.dk. Alle rettigheder forbeholdes.