---

Efter at have fået nogle gode råd herinde omkring css kodning, har jeg
kastet mig ud i det.
Men jeg er løbet på en lille forhindring.

Jeg har en menu der er delt i 5 dele.
En top
En midte der er variabel i størrelsen
En bund
Et variabelt tomt stykke
En sidebund

Jeg har skrevet css sådan

table.menu {border-collapse: collapse;
border-width: 0px;
height: 100%;
text-align: center;}

td.menurammetop {background: url(LayoutMenuTop.png);
width: 166px;
height: 133px;}

td.menurammemidt{background: url(LayoutMenuG.png);
text-align: center;
width: 166px;}

td.menurammeslut{background: url(LayoutMenuSlut.png);
width: 166px;
height: 150px;}

td.menublaa {background: url(LayoutUnderMenu.png);
width: 166px;}

td.menubund {background: url(LayoutSideBund.png);
width: 166px;
height: 111px;}


På siden har jeg så skrevet
<table class="menu">
<tr><td class="menurammetop"></td></tr>
<tr><td class="menurammemidt"><?include 'Menu.php';?></td></tr>
<tr><td class="menurammeslut"></td></tr>
<tr><td class="menublaa"></td></tr>
<tr><td class="menubund"></td></tr>
</table>

Det virker også fint, men det stykke efter menuslut og menubund kan jeg ikke
få til at gøre som jeg vil.

Meningen er at sidebunden skal ligge helt nede i bunden af siden, og at det
stykke undermenu'en der hedder menublaa (et blåt stykke) altid skal gå fra
menurammeslut til sidebund.

Jeg har prøvet noget med 100% men det virker ikke.
Det blå stykke er bare 0 højt hvis jeg ikke angiver en højde på den td.
Og det skal jo netop ikke være en fast højde.


Så hvordan for jeg sidebunden til altid at være helt i bunden alt efter hvor
langt side indholdet nu er.

---

Hej!
"EnjoyNews" <a@a.dk> skrev i en meddelelse
news:44205bae$0$913$edfadb0f@dread14.news.tele.dk...
> Efter at have fået nogle gode råd herinde omkring css kodning, har jeg
> kastet mig ud i det.

Fornuftigt!

> Men jeg er løbet på en lille forhindring.

Det sker...

> Jeg har en menu....

[SNIP - en masse kode...]

Og her kommer så 2 GRATIS råd til dig:

1: Start med at skrive et link til siden (jeg har selv begået samme fejl
engang...) - det er en slags hjælp til selv-hjælp...

2: Drop tabeller medmindre det er absolut nødvendigt (Det bliver hurtigt for
uoverskueligt...)! Det er det ikke i dit tilfælde... Vejen frem er opbygning
med <div></div> og positionering med float (mere brugervenligt=flere
besøgende...).

Opfyldelse af pkt. 1 er mere eller mindre et krav, såfremt du ønsker hjælp
herinde - ikke kun fra mig, men fra ca. 99% af brugerne af
nyhedsgrupperne....

Pkt. 2 er valgfri, men du vil opleve, at mange af de "gamle og garvede"
herinde, vil sige det samme - eller næsten...

Held og lykke med projektet!


Med venlig hilsen
--
Dennis Munding
Web-master
http://www.skovaa-munding.dk/, http://www.mundings-memorial.dk/
http://www.cantica.dk/, http://www.eds-denmark.dk/

---

"Dennis Munding" <mail@invalid.dk> skrev i en meddelelse
news:gLZTf.128$8V7.89@news.get2net.dk...
> Hej!
> "EnjoyNews" <a@a.dk> skrev i en meddelelse
> news:44205bae$0$913$edfadb0f@dread14.news.tele.dk...
>
> Og her kommer så 2 GRATIS råd til dig:
>
> 1: Start med at skrive et link til siden (jeg har selv begået samme fejl
> engang...) - det er en slags hjælp til selv-hjælp...

Selvfølgelig.
Den er dog tophemmelig ligenu, og ligger i en mappe på en af mine andre
sider.

http://www.mltr-universe.dk/TEST/

Som du kan se er menu'en klappet sammen, den sidste grønne trekant skulle
have været trukket ned i bunden.

Og af en eller anden grund er siden hvor der står Velkommen også klappet
sammen i IE men ikke i Firefox.


>
> 2: Drop tabeller medmindre det er absolut nødvendigt (Det bliver hurtigt
for
> uoverskueligt...)! Det er det ikke i dit tilfælde... Vejen frem er
opbygning
> med <div></div> og positionering med float (mere brugervenligt=flere
> besøgende...).

JO... det er der jeg ikke er helt dygtig nok
Jeg har altid lavet hjemmesider i tabeller, og har lidt svært ved at finde
ud af hvordan man sætter det op på samme måde uden.
Men jeg ville meget gerne, det er bare lige evnerne der mangler

---

EnjoyNews wrote:
> "Dennis Munding" <mail@invalid.dk> skrev i en meddelelse
> news:gLZTf.128$8V7.89@news.get2net.dk...
>
>>Hej!
>>"EnjoyNews" <a@a.dk> skrev i en meddelelse
>>news:44205bae$0$913$edfadb0f@dread14.news.tele.dk...
>>
>>Og her kommer så 2 GRATIS råd til dig:
>>
>>1: Start med at skrive et link til siden (jeg har selv begået samme fejl
>>engang...) - det er en slags hjælp til selv-hjælp...
>
>
> Selvfølgelig.
> Den er dog tophemmelig ligenu, og ligger i en mappe på en af mine andre
> sider.
>
> http://www.mltr-universe.dk/TEST/
>
> Som du kan se er menu'en klappet sammen, den sidste grønne trekant skulle
> have været trukket ned i bunden.

Hvordan skulle den kunne blive det?

> Og af en eller anden grund er siden hvor der står Velkommen også klappet
> sammen i IE men ikke i Firefox.
>

Det tror da pokker - der er jo ikke noget indhold i dine
tabelceller, så kan de jo ikke fylde noget, medmindre
du givet dem en eksplicit højde.

Bortset fra det, så laver man nu menuer som lister,
for det er det det er:

<ul class="menu">
<li>Menupunkt</li>
<li>Menupunkt</li>
<li>Menupunkt</li>
<li>Menupunkt</li>
<li>Menupunkt</li>
</ul>

Se for eksempel

http://www.webdesign101.dk/www/cssmenu/index.php

vedr. CSS-formateringen af listen.


--

Med venlig hilsen

Jørgen Farum Jensen
http://www.webdesign101.dk
..

---

"Jørgen Farum Jensen" <jfjenzen@yahoo.dk> skrev i en meddelelse
news:4420823f$0$38637$edfadb0f@dread12.news.tele.dk...
> EnjoyNews wrote:
> > "Dennis Munding" <mail@invalid.dk> skrev i en meddelelse
> > news:gLZTf.128$8V7.89@news.get2net.dk...
> >
> >>Hej!
> >>"EnjoyNews" <a@a.dk> skrev i en meddelelse
> >>news:44205bae$0$913$edfadb0f@dread14.news.tele.dk...
> >>

>
> > Og af en eller anden grund er siden hvor der står Velkommen også klappet
> > sammen i IE men ikke i Firefox.
> >
>
> Det tror da pokker - der er jo ikke noget indhold i dine
> tabelceller, så kan de jo ikke fylde noget, medmindre
> du givet dem en eksplicit højde.

Nej, men hvorfor er den ikke samme højde som menuen.. Det ligger jo i samme
table.


>
> Bortset fra det, så laver man nu menuer som lister,
> for det er det det er:
>
> <ul class="menu">
> <li>Menupunkt</li>
> <li>Menupunkt</li>
> <li>Menupunkt</li>
> <li>Menupunkt</li>
> <li>Menupunkt</li>
> </ul>
>

Menu'en er slet ikke lavet endnu, så det kommer

---

EnjoyNews wrote:

> Selvfølgelig.

> http://www.mltr-universe.dk/TEST/

Trods gentagne råd om ikke at fastlåse siden på en bredde på 1024px har du
stadig fastholdt den bredde. Brugere, som slet ikke har så stor
skærmopløsning og som bruger FF kan ikke se de yderste højre 250px.

I IE udløser din store sidebredde en vandret scrollbar.

Du har også stadig tabeller i tabeller. Det er uhensigtsmæssigt. Brug div (i
html) og float (i css).

Selv om du er begyndt at bruge css, har du stadig en html-definition for
centrering af den omgivende div. den rigtige metode er denne i css:

div {
width: 770px; /* gå ikke hejere op, hvis du vil sætte en bredde */
margin:auto;
}

Skal du definere en højde på noget element på siden som 100%, skal du først
definere, hvad de 100% dækker over, i css:

html, body {
height: 100%
}

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://html-faq.dk/

---

"Erik Ginnerskov" <erik@donotspammmeplease.invalid> skrev i en meddelelse
news:44208519$0$15791$14726298@news.sunsite.dk...
> EnjoyNews wrote:
>
> > Selvfølgelig.
>
> > http://www.mltr-universe.dk/TEST/
>
> Trods gentagne råd om ikke at fastlåse siden på en bredde på 1024px har du
> stadig fastholdt den bredde. Brugere, som slet ikke har så stor
> skærmopløsning og som bruger FF kan ikke se de yderste højre 250px.
>
> I IE udløser din store sidebredde en vandret scrollbar.

Meningen er at den skal kunne skallere vandret mellem menu kanten og den
gørnne boks i toppen, og igen efter den grønne boks og højre side kant.
Så brude den kunne komme ned på ca- det du nævner, og samtidig bliver
bredere hvis man har større skærme.


>
> Du har også stadig tabeller i tabeller. Det er uhensigtsmæssigt. Brug div
(i
> html) og float (i css).

Jeg har prøvet lidt på det her.
http://www.mltr-universe.dk/TEST/TEST/
og det virker også fint, men heller ikke her kan jeg få den 100%


> Skal du definere en højde på noget element på siden som 100%, skal du
først
> definere, hvad de 100% dækker over, i css:
>
> html, body {
> height: 100%
> }

Hvis jeg gør dette hiver den bund et godt stykke ned under kanten af skærmen
og laver en scroll bar.
Så det ser ud til at 100% er større end skærmen ?

---

EnjoyNews wrote:


>> html, body {
>> height: 100%
>> }
>
> Hvis jeg gør dette hiver den bund et godt stykke ned under kanten af
> skærmen og laver en scroll bar.

Min fejl, sorry. Jeg glemte i farten, at 100% + margin/padding er mere end
100%.

html, body {
margin: 0;
padding: 0;
height: 100%
}

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://html-faq.dk/

---

"Erik Ginnerskov" <erik@donotspammmeplease.invalid> skrev i en meddelelse
news:442090c5$0$15783$14726298@news.sunsite.dk...
> EnjoyNews wrote:
>
>
> >> html, body {
> >> height: 100%
> >> }
> >
> > Hvis jeg gør dette hiver den bund et godt stykke ned under kanten af
> > skærmen og laver en scroll bar.
>
> Min fejl, sorry. Jeg glemte i farten, at 100% + margin/padding er mere end
> 100%.
>
> html, body {
> margin: 0;
> padding: 0;
> height: 100%
> }

hmmm. det stadig ikke helt...

Der virker som om at det sykke den udvider #menublaa med er en hel side
højde.
Altså hvis browser vinduet er 577 højt, så er de 100% der står i #menublaa
577.

Det ligger sådan lige nu på

http://www.mltr-universe.dk/TEST/TEST/

---

EnjoyNews wrote:

> hmmm. det stadig ikke helt...

> http://www.mltr-universe.dk/TEST/TEST/

Du har i css lavet dette:

html, body {
margin: 200;
padding: 200;
height: 100%;
}

For det første skal der benævnelse (eks. px) på din margin og padding, hvis
værdien ikke er 0 (nul). Ellers er det helt tilfældigt, hvordan de
forskellige browsere tolker din kode.

For det andet er det nok lige voldsomt nok at sætte men margin på 200px plus
en padding på 200px. Mon ikke det var sådan, du skulle have lavet det:

html, body {
margin: 0;
padding: 0;
height: 100%;
}

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://html-faq.dk/

---

"Erik Ginnerskov" <erik@donotspammmeplease.invalid> skrev i en meddelelse
news:4421f150$0$15790$14726298@news.sunsite.dk...
> EnjoyNews wrote:
>
> > hmmm. det stadig ikke helt...
>
> > http://www.mltr-universe.dk/TEST/TEST/
>
> Du har i css lavet dette:
>
> html, body {
> margin: 200;
> padding: 200;
> height: 100%;
> }
>
> For det første skal der benævnelse (eks. px) på din margin og padding,
hvis
> værdien ikke er 0 (nul). Ellers er det helt tilfældigt, hvordan de
> forskellige browsere tolker din kode.
>
> For det andet er det nok lige voldsomt nok at sætte men margin på 200px
plus
> en padding på 200px. Mon ikke det var sådan, du skulle have lavet det:
>
> html, body {
> margin: 0;
> padding: 0;
> height: 100%;
> }

Sorry, det er min fejl.. Jeg prøvede at ændre det til 200 for at se om der
var nogen forskel på 0 og 200 og det var der ikke. Så jeg glemte lige at
sætte den tilbage igen

Men nu er den tilbage på 0 igen, og det er stadig det samme.

Det virker som om at jeg definere min 100% højde til højden på mit browser
vindue og at det så er den fulde browser størrelse den sætter ind i
#menublaa da jeg der har skrevet 100%

---

EnjoyNews wrote:

> Men nu er den tilbage på 0 igen, og det er stadig det samme.

Kigger du på dine definitioner for menuens opbygning, er det logisk, a det
kikser:

#menurammetop - højde 133px
#menurammeslut - højde 150px
#menublaa - højde 100%
#menubund - højde 111px

I alt - højde 100% + 394px

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://html-faq.dk/

---

"Erik Ginnerskov" <erik@donotspammmeplease.invalid> skrev i en meddelelse
news:4422d087$0$15786$14726298@news.sunsite.dk...
> EnjoyNews wrote:
>
> > Men nu er den tilbage på 0 igen, og det er stadig det samme.
>
> Kigger du på dine definitioner for menuens opbygning, er det logisk, a det
> kikser:
>
> #menurammetop - højde 133px
> #menurammeslut - højde 150px
> #menublaa - højde 100%
> #menubund - højde 111px
>
> I alt - højde 100% + 394px

Ja jeg kan sagtens se logikken i det, men det ligge jo i en div der hedder
screen som er 100% i højden.
Så troede jeg ikke at noget inde i den kunne blive højere.

Men hvordan gøres det så. ?


Jeg har lidt samme problem med en ramme jeg prøver at lave.
Det er en speciel ramme laver af grafik stykker så den er elastisk.

Den består af 9 dele 3 i toppen og 3 i bunden. Derudover én i hver side og
så midten.

De tre i toppen kan jeg godt lave med float så de står efter hinanden, og
den midterste af dem er så elastisk.
Det samme gælder for bunden.

Men midten kan jeg ikke få til at virke.
Når der bliver sat tekst ind i midterstykker udvides den jo i højden, og det
kan side stykkerne i følge med på.
Der er kun billedet én enkel gang, og det bliver altså ikke repeated ned ad.


Kan det ikke lade sig gøre på denne måde, eller er der en anden måde at lave
en flexible ramme ?

---

EnjoyNews wrote:

> Men hvordan gøres det så. ?

Du skal #screen lave en boks #menu til menuen:

#menu {
height: 100%;
float: left;
width: 166px;
position: relative;
background: url(LayoutMenuB.png);
color: #000;
padding:0;
}

Den relative positionering af #menu gør, at du kan positionere #menubund i
forhold til placeringen af #menu, ellers vil den absolutte positionering af
#menubund blive i forhold til browservinduet.

Derefter lægger du inde i #menu din #menurammetop, #menurammemidt og
#menurammeslut sådan:

#menurammetop {
background: url(LayoutMenuTop.png);
color: #000;
height: 133px;
margin: 0;
}

#menurammemidt {
background: url(LayoutMenuG.png);
color: #000;
margin: 0;
}

#menurammeslut {
background: url(LayoutMenuSlut.png);
color: #000;
height: 150px;
margin: 0;
}

Endelig lægger du - stadig i #menu din #menubund sådan:

#menubund {
position: absolute;
bottom: 0;
background: url(LayoutMenuBund.png)
color: #000;
height: 111px;
margin: 0;
}

> Jeg har lidt samme problem med en ramme jeg prøver at lave.
> Det er en speciel ramme laver af grafik stykker så den er elastisk.
>
> Den består af 9 dele 3 i toppen og 3 i bunden. Derudover én i hver
> side og så midten.

Er det sådan noget, du prøver at lave?

http://html-faq.dk/test/ramme/

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://html-faq.dk/

---

"Erik Ginnerskov" <erik@donotspammmeplease.invalid> skrev i en meddelelse
news:44233a39$0$15784$14726298@news.sunsite.dk...
> EnjoyNews wrote:
>
> > Men hvordan gøres det så. ?
>
> Du skal #screen lave en boks #menu til menuen:
>
> #menu {
> height: 100%;
> float: left;
> width: 166px;
> position: relative;
> background: url(LayoutMenuB.png);
> color: #000;
> padding:0;
> }
>
> Den relative positionering af #menu gør, at du kan positionere #menubund i
> forhold til placeringen af #menu, ellers vil den absolutte positionering
af
> #menubund blive i forhold til browservinduet.
>
> Derefter lægger du inde i #menu din #menurammetop, #menurammemidt og
> #menurammeslut sådan:
>
> #menurammetop {
> background: url(LayoutMenuTop.png);
> color: #000;
> height: 133px;
> margin: 0;
> }
>
> #menurammemidt {
> background: url(LayoutMenuG.png);
> color: #000;
> margin: 0;
> }
>
> #menurammeslut {
> background: url(LayoutMenuSlut.png);
> color: #000;
> height: 150px;
> margin: 0;
> }
>
> Endelig lægger du - stadig i #menu din #menubund sådan:
>
> #menubund {
> position: absolute;
> bottom: 0;
> background: url(LayoutMenuBund.png)
> color: #000;
> height: 111px;
> margin: 0;
> }

Mange mange tak..

Det vil jeg lige prøve af lidt senere )



>
> > Jeg har lidt samme problem med en ramme jeg prøver at lave.
> > Det er en speciel ramme laver af grafik stykker så den er elastisk.
> >
> > Den består af 9 dele 3 i toppen og 3 i bunden. Derudover én i hver
> > side og så midten.
>
> Er det sådan noget, du prøver at lave?
>
> http://html-faq.dk/test/ramme/

Lige præcis... Nu kan jeg godt se hvor jeg er gået galt i byen...
Jeg tror jeg kan se fidusen

---

"Erik Ginnerskov" <erik@donotspammmeplease.invalid> skrev i en meddelelse
news:44233a39$0$15784$14726298@news.sunsite.dk...
> EnjoyNews wrote:
>
> > Men hvordan gøres det så. ?
>
> Du skal #screen lave en boks #menu til menuen:
>
> #menu {
> height: 100%;
> float: left;
> width: 166px;
> position: relative;
> background: url(LayoutMenuB.png);
> color: #000;
> padding:0;
> }
>
> Den relative positionering af #menu gør, at du kan positionere #menubund i
> forhold til placeringen af #menu, ellers vil den absolutte positionering
af
> #menubund blive i forhold til browservinduet.
>
> Derefter lægger du inde i #menu din #menurammetop, #menurammemidt og
> #menurammeslut sådan:
>
> #menurammetop {
> background: url(LayoutMenuTop.png);
> color: #000;
> height: 133px;
> margin: 0;
> }
>
> #menurammemidt {
> background: url(LayoutMenuG.png);
> color: #000;
> margin: 0;
> }
>
> #menurammeslut {
> background: url(LayoutMenuSlut.png);
> color: #000;
> height: 150px;
> margin: 0;
> }
>
> Endelig lægger du - stadig i #menu din #menubund sådan:
>
> #menubund {
> position: absolute;
> bottom: 0;
> background: url(LayoutMenuBund.png)
> color: #000;
> height: 111px;
> margin: 0;
> }


Super Super... det virker jo...

Nu kan jeg se fidusen, nu da jeg lige fik kigget på det.
Du har lagt den flexible menublaa ind bag ved hele menu'en, og så bare lagt
bunden til absolut bottom 0.
Så vil menublaa jo bare være i det mellem der opstår.

Edder smart, og mange tak

---

EnjoyNews wrote:

> Edder smart,

Keine Hexerei, nur behändickeit.

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://html-faq.dk/