---

Jeg er ved at lave en opbygning vha. css, men er redt i en i et
problem.
Jeg vil gerne have en afslutnig på siden i form af en rød streg som
altid er nederst, men hvis min tekst er meget lang, så bliver min
afslutningsstreng placeret midt i teksten og det ser forfærdigt ud
Se her: <URL:http://www.goose.dk/css>
Min css ser sådan her ud:

body{
color:#9E0B0E;
font-family:'Verdana','Tahoma','Arial',sans-serif;
font-size:12px;
background-color:#F0F0F0;
margin:0px;
padding:0px;
text-align:center;
height:100%;
}

..layout{
background-color:#F8F7E6;
width:780px;
height:100%;
margin-top:0px;
margin-left:auto;
margin-right:auto;
margin-bottom:0px;
text-align:left;
padding:0px;
border:solid 1px #9E0B0E;
position:relative;
}


..top{
position:absolute;
top:0px;
left:0px;
height:63px;
width:100%;
}

..foto{
position:absolute;
top:63px;
left:0px;
height:210px;
width:290px;
}

..bundfoto{
position:absolute;
background-color:#9E0B0E;
top:274px;
left:0px;
height:5px;
width:289px;
font-size:1px;
}


..redmenu{
position:absolute;
background-color:#9E0B0E;
top:63px;
left:290px;
height:210px;
width:489px;
}

..bund{
position:absolute;
bottom:0px;
left:0px;
height:15px;
width:100%;
background-color:#9E0B0E;
font-size:10px;
color:#F8F7E6;
text-align:right;
margin-right:5px;
}


..indhold{
position:absolute;
padding:10px;
top:280px;
left:0px;
background:transparent;
}

H1{
font-family:'Tahoma','Verdana','Arial',sans-serif;
font-size:16px;
font-weight:bold;
letter-spacing:1px;
margin-left:0px;
margin-bottom:10px;
}

P{
margin:0px;
}

table {
font-family:'Verdana','Tahoma','Arial',sans-serif;
font-size:12px;
border-collapse:collapse;
}

/Goose

---

wrote:

> Jeg vil gerne have en afslutnig på siden i form af en rød streg
> som altid er nederst, men hvis min tekst er meget lang, så bliver
> min afslutningsstreng placeret midt i teksten og det ser
> forfærdigt ud Se her: <URL:http://www.goose.dk/css>

[snip en masse CSS]
Et link til dit CSS-ark er tilstrækkeligt.

Du har:

..layout{
   background-color:#F8F7E6;
   width:780px;
   height:100%;
   margin-top:0px;
   margin-left:auto;
   margin-right:auto;
   margin-bottom:0px;
   text-align:left;
   padding:0px;
   border:solid 1px #9E0B0E;
   position:relative;
}

Drop 'height: 100%;' - det vil alligevel ikke give andet end
problemer, hvis indholdet fylder mere end browservinduets højde.

Da .layout er det yderste element, kan du sætte den tykke røde streg
som border-bottom på dette:

..layout {
   position: relative;
   background: #f8f7e6;
   width: 789px;
   margin: 0 auto;
   text-align: left;
   border-top: 1px solid #9e0b0e;
   border-right: 1px solid #9e0b0e;
   border-bottom: 15px solid #9e0b0e;
   border-left: 1px solid #9e0b0e;
}


I øvrigt burde du næsten benytte id i stedet for class til dine
layout-orienterede elementer - du får vel næppe brug for to "layout"-
div'er?

--
Anders Thorsen Holm | http://www.daimi.au.dk/~zoolook/

Overvejer du at købe en DVD-afspiller? Så hold dig fra Fona!
Læs hvorfor: http://www.daimi.au.dk/~zoolook/fona/

---

Anders Thorsen Holm wrote:

> width: 789px;

Skulle naturligvis være "780px".

--
Anders Thorsen Holm | http://www.daimi.au.dk/~zoolook/

Overvejer du at købe en DVD-afspiller? Så hold dig fra Fona!
Læs hvorfor: http://www.daimi.au.dk/~zoolook/fona/

---

On Sat, 3 Apr 2004 13:17:37 +0000 (UTC), Anders Thorsen Holm
<zoolook@daimi.au.invalid> wrote:

> wrote:
>Da .layout er det yderste element, kan du sætte den tykke røde streg
>som border-bottom på dette:

Ja det kunne jeg jo godt, men hvis jeg nu vil indsætte noget
adresseinfo i den nederste linie dur det ligesom ikke ?

/Goose

---

wrote:

>> Da .layout er det yderste element, kan du sætte den tykke røde
>> streg som border-bottom på dette:
>
> Ja det kunne jeg jo godt, men hvis jeg nu vil indsætte noget
> adresseinfo i den nederste linie dur det ligesom ikke ?

Se, det fremgik jo slet ikke af dit oprindelige indlæg.

Men jeg formoder, det er det, du vil bruge din bund-div til? I så
fald skriver du da bare

..bund{
   background-color:#9E0B0E;
   font-size:10px;
   color:#F8F7E6;
   text-align:right;
}

<div class="bund">
Her kan der stå en hel del i bunden.
</div>

Bemærk at jeg her *ikke* bruger absolut positionering til bund-
div'en. Den vil i stedet placere sig efter det øvrige indhold.
Husk, at når du bruger 'position: absolute' så fjernes det pågældende
element fra dokumentets flow - de øvrige elementer vil altså ikke
tage højde for hverken højde, bredde eller placering af pågældende
element.

Måske du kunne lade dig inspirere af det her:

<http://www.daimi.au.dk/~zoolook/webdesign/floating2.html>
<http://www.daimi.au.dk/~zoolook/webdesign/floating3.html>

--
Anders Thorsen Holm | http://www.daimi.au.dk/~zoolook/

Overvejer du at købe en DVD-afspiller? Så hold dig fra Fona!
Læs hvorfor: http://www.daimi.au.dk/~zoolook/fona/

---

On Sat, 3 Apr 2004 13:53:18 +0000 (UTC), Anders Thorsen Holm
<zoolook@daimi.au.invalid> wrote:

>Se, det fremgik jo slet ikke af dit oprindelige indlæg.
>Men jeg formoder, det er det, du vil bruge din bund-div til? I så
>fald skriver du da bare

Ja det var meningen at jeg ville bruge bund div'en til det.
Årsagen til hele mit problem er, at jeg gerne vil have alt det
grafiske og menupunkter placeret sidst i dokumentet således at selve
tekstindholdet på siden kommer så langt op i kildekoden som muligt
pga. søgemaskinerne.
Derfor ønsker jeg at placerer alle mine "faste" elementer med absolut.

/Goose

---

wrote:

> Årsagen til hele mit problem er, at jeg gerne vil have alt det
> grafiske og menupunkter placeret sidst i dokumentet således at
> selve tekstindholdet på siden kommer så langt op i kildekoden som
> muligt pga. søgemaskinerne.
> Derfor ønsker jeg at placerer alle mine "faste" elementer med
> absolut.

Prøv at fjerne 'position: absolute' fra .indhold, behold 'position:
absolute' på det, der skal være i toppen, og fjern 'position:
absolute' fra det, der skal være i bunden. Giv dernæst .layout en
passende margin eller padding i toppen, så der gøres plads til hvad der
nu end skal placeres i toppen.

--
Anders Thorsen Holm | http://www.daimi.au.dk/~zoolook/

Overvejer du at købe en DVD-afspiller? Så hold dig fra Fona!
Læs hvorfor: http://www.daimi.au.dk/~zoolook/fona/

---

On Sat, 3 Apr 2004 13:17:37 +0000 (UTC), Anders Thorsen Holm
<zoolook@daimi.au.invalid> wrote:

>.layout {
>    position: relative;
>    background: #f8f7e6;
>    width: 780px;
>    margin: 0 auto;
>    text-align: left;
>    border-top: 1px solid #9e0b0e;
>    border-right: 1px solid #9e0b0e;
>    border-bottom: 15px solid #9e0b0e;
>    border-left: 1px solid #9e0b0e;
>}
Jeg har nu lavet det som du skrev, men det giver et helt andet
resultat <URL:http://www.goose.dk/css2>

/Goose

---

wrote:

> Jeg har nu lavet det som du skrev, men det giver et helt andet
> resultat <URL:http://www.goose.dk/css2>

Problemet er at du bruger absolut positionering til .top, .foto,
..bundfoto, .redmenu, .bund og .indhold - og som forklaret andetsteds i
tråden, vil absolut positionerede elementer fjernes fra dokumentets
flow.

Kunne du ikke give en grafisk skitste til det layout, du ønsker at
opnå? Lige nu er det ikke til at finde hverken hovede eller hale i.

--
Anders Thorsen Holm | http://www.daimi.au.dk/~zoolook/

Overvejer du at købe en DVD-afspiller? Så hold dig fra Fona!
Læs hvorfor: http://www.daimi.au.dk/~zoolook/fona/

---

On Sat, 3 Apr 2004 14:06:09 +0000 (UTC), Anders Thorsen Holm
<zoolook@daimi.au.invalid> wrote:

>Kunne du ikke give en grafisk skitste til det layout, du ønsker at
>opnå? Lige nu er det ikke til at finde hverken hovede eller hale i.

Jo da, ligger her: <URL:http://www.goose.dk/skitse.gif>

/Goose

---

admin@goose.dk wrote:

>>Kunne du ikke give en grafisk skitste til det layout, du ønsker at
>>opnå? Lige nu er det ikke til at finde hverken hovede eller hale i.
>
> Jo da, ligger her: <URL:http://www.goose.dk/skitse.gif>

Jeg har bikset en mulig løsning sammen:

   <http://www.daimi.au.dk/~zoolook/webdesign/goose.html>

så kan du selv arbejde videre derfra.

--
Anders Thorsen Holm | http://www.daimi.au.dk/~zoolook/

Overvejer du at købe en DVD-afspiller? Så hold dig fra Fona!
Læs hvorfor: http://www.daimi.au.dk/~zoolook/fona/

---

On Sat, 3 Apr 2004 14:48:42 +0000 (UTC), Anders Thorsen Holm
<zoolook@daimi.au.invalid> wrote:

>Jeg har bikset en mulig løsning sammen:
Takker, jeg kigger lidt nærmere på det, dog ville jeg godt have hvis
det altid fyldte 100% i højden således at adresselinien altid var
nederst selvom der ikke er ret meget tekst på siden, men ellers må jeg
leve med det som det er.

/Goose

---

admin@goose.dk wrote:

> Takker, jeg kigger lidt nærmere på det, dog ville jeg godt have
> hvis det altid fyldte 100% i højden således at adresselinien altid
> var nederst selvom der ikke er ret meget tekst på siden, men
> ellers må jeg leve med det som det er.

Det er desværre en af de ting, der ikke rigtig lader sig gøre med
CSS. 'height: 100%' har en kedelig tendens til at give problemer med
baggrunde, hvis indholdet fylder mere end browservinduets højde.

Du kunne muligvis benytte 'position: fixed' til #footer og så bruge
et hack til at få det til at virke i IE også (søg tilbage i gruppen).
Med hensyn til baggrunden og de røde kanter, så kunne du lave et
billede, du lægger som baggrund på #container og gentager hele vejen
ned.

Men generelt er det ikke rigtig muligt at gøre layoutet flydende
vertikalt. Det er det iøvrigt heller ikke med tabelbaserede layouts -
i hvert fald ikke, hvis koden skal validere, eftersom der ikke findes
nogen 'height'-attribut til hverken <table> eller <td>-elementerne

--
Anders Thorsen Holm | http://www.daimi.au.dk/~zoolook/

Overvejer du at købe en DVD-afspiller? Så hold dig fra Fona!
Læs hvorfor: http://www.daimi.au.dk/~zoolook/fona/

---

Anders Thorsen Holm <zoolook@daimi.au.invalid> skrev :

>Men generelt er det ikke rigtig muligt at gøre layoutet flydende
>vertikalt. Det er det iøvrigt heller ikke med tabelbaserede layouts -
>i hvert fald ikke, hvis koden skal validere, eftersom der ikke findes
>nogen 'height'-attribut til hverken <table> eller <td>-elementerne

Øhh, hvornår er det blevet forbudt at sætte height på en <td>?
--
Knud

---

Knud Gert Ellentoft <ellentoft@mail.tele.invalid> wrote:

> Øhh, hvornår er det blevet forbudt at sætte height på en <td>?

Jeg var nok lidt for hurtigt der. Det er legalt i de forskellige
transitional doctypes, men ikke i hverken HTML 4.01 Strict eller XHTML
1.0/1.1 Strict.

Jeg lod mig forvirre af DTDen for HTML 4.01:

   <http://www.w3.org/TR/html401/struct/tables.html#edef-TD>

--
Anders Thorsen Holm | http://www.daimi.au.dk/~zoolook/

Overvejer du at købe en DVD-afspiller? Så hold dig fra Fona!
Læs hvorfor: http://www.daimi.au.dk/~zoolook/fona/

---

Anders Thorsen Holm <zoolook@daimi.au.invalid> skrev :

>Jeg var nok lidt for hurtigt der. Det er legalt i de forskellige
>transitional doctypes, men ikke i hverken HTML 4.01 Strict eller XHTML
>1.0/1.1 Strict.

Njah...

I strict er det jo meningen, at den slags skal angives med css og
der virker det godt nok.
--
Knud

---

Sat, 03 Apr 2004 15:08:16 +0200. skrev admin:

> Jeg er ved at lave en opbygning vha. css, men er redt i en i et
> problem.
> Jeg vil gerne have en afslutnig på siden i form af en rød streg som
> altid er nederst, men hvis min tekst er meget lang, så bliver min
> afslutningsstreng placeret midt i teksten og det ser forfærdigt ud
> Se her: <URL:http://www.goose.dk/css>

Hvis jeg var dig ville jeg lave stregen som en border-bottom på boksen.
Så vil den altid komme nederst. hvis du ikke vil have at din boks bliver
stører end end hvis størrelse, kan du eventuelt give den overflow:auto;,
så vil scrollbaren komme på boksen i steddet for i kanten af siden.

--
Thomas
- "Videnskab uden religion er lam,
religion uden videnskab er blind." - Albert Einstein