|
| [CSS] Layout af nyt webiste - hjælp til po~ Fra : Steen Eiler Jørgense~ |
Dato : 09-04-03 10:00 |
|
Jeg er ved at designe et nyt layout til mit webiste - kig engang på
http://www.fys.ku.dk/~sej/layout.gif
Den blå baggrund er selve siden. Ovenpå denne har jeg placeret fire "div"s,
alle absolut positioneret (de tre hvide foroven og den grønne).
Inde i den grønne div har jeg placeret min hovedmenu ude til venstre -
absolut positioneret, mit "content"-felt til højre, og en footer
allernederst.
Mit problem er, at hvis jeg positionerer mit content-felt absolut, så kommer
footeren ikke til at stå under content-feltet, men oveni det (og længden af
content-feltet varierer jo af gode grunde fra side til side!). Hvis jeg
positionerer mit content-felt relativt, bliver det jo relativt til hvor
hovedmenuen afsluttes, hvilket jo også kommer an på, hvor i
navigationsstrukturen, man er, da menuen kan folde sig ud.
Argh - jeg er helt lost! Hjælp...
--
Steen Eiler Jørgensen
"No, I don't think I'll ever get over Macho Grande.
Those wounds run...pretty deep."
| |
jopa (09-04-2003)
| Kommentar Fra : jopa |
Dato : 09-04-03 10:40 |
| | |
Steen Eiler Jørgense~ (09-04-2003)
| Kommentar Fra : Steen Eiler Jørgense~ |
Dato : 09-04-03 11:03 |
|
"jopa" <j@paulsen.mail.dk> skrev
> Kender du denne ?
> http://www.thenoodleincident.com/tutorials/box_lesson/boxes.html
Øh, nej, det gjorde jeg ikke, men hvad skal jeg bruge det til? Jeg kan ikke
lige umiddelbart se relevansen.
--
Steen Eiler Jørgensen
"No, I don't think I'll ever get over Macho Grande.
Those wounds run...pretty deep."
| |
jopa (09-04-2003)
| Kommentar Fra : jopa |
Dato : 09-04-03 13:27 |
|
Davs du
Steen Eiler Jørgensen <oz1sejREMOVETHIS@get2net.dk> skrev bla:
> Øh, nej, det gjorde jeg ikke, men hvad skal jeg bruge det til? Jeg
> kan ikke lige umiddelbart se relevansen.
Relevansen er CSS.
Kunne være der var nogle fiduser til dit probl på omtalte side.
--
Mvh. John
www.johns-web.dk / www.jp-web.dk
www.web-templates.dk
Teamwork sharpening the skills!!
| |
Steen Eiler Jørgense~ (09-04-2003)
| Kommentar Fra : Steen Eiler Jørgense~ |
Dato : 09-04-03 13:35 |
|
"jopa" <j@paulsen.mail.dk> skrev
> Relevansen er CSS.
> Kunne være der var nogle fiduser til dit probl på omtalte side.
Ja, OK, det er rigtigt. Men jeg synes desværre ikke rigtigt, der var noget,
jeg kunne bruge. Men tak alligevel
--
Steen Eiler Jørgensen
"No, I don't think I'll ever get over Macho Grande.
Those wounds run...pretty deep."
| |
Erik Ginnerskov (09-04-2003)
| Kommentar Fra : Erik Ginnerskov |
Dato : 09-04-03 11:57 |
|
"Steen Eiler Jørgensen" <oz1sejREMOVETHIS@get2net.dk> skrev
> Jeg er ved at designe et nyt layout til mit webiste - kig engang på
> http://www.fys.ku.dk/~sej/layout.gif
>
> Den blå baggrund er selve siden. Ovenpå denne har jeg placeret fire
"div"s,
> alle absolut positioneret (de tre hvide foroven og den grønne).
>
> Inde i den grønne div har jeg placeret min hovedmenu ude til venstre -
> absolut positioneret, mit "content"-felt til højre, og en footer
> allernederst.
Du skal ikke lægge din menu, din content og din footer med en absolut
positionering.
Den rigtige metode er, at du lægger din menu med en float:left.
content-boksen lægger sig så automatisk til højre for menuen. Det kan så
have den ulempe, at content breder sig til venstre under menuen. Det kan du
modvirke ved også at tildele content float:left.
Din footer tildeler du så clear:both.
I css:
div.menu{
float:left;
øvrige formateringer;
}
div.content{
float:left;
øvrige formateringer;
}
div.footer{
clear:both;
øvrige formateringer;
}
--
Med venlig hilsen
Erik Ginnerskov - erik snabela ginnerskov dot dk
http://www.hjemmesideskolen.dk - http://www.html-faq.dk
http://hjem.get2net.dk/sorgin
| |
Steen Eiler Jørgense~ (09-04-2003)
| Kommentar Fra : Steen Eiler Jørgense~ |
Dato : 09-04-03 12:30 |
|
"Erik Ginnerskov" <egin@SPAMKILLoncable.dk> skrev
> Du skal ikke lægge din menu, din content og din footer med en absolut
> positionering.
> Den rigtige metode er, at du lægger din menu med en float:left.
> content-boksen lægger sig så automatisk til højre for menuen. Det kan så
> have den ulempe, at content breder sig til venstre under menuen. Det kan
du
> modvirke ved også at tildele content float:left.
> Din footer tildeler du så clear:both.
Okay - nu kan jeg se, hvor du vil hen - det giver god mening. Så opstår bare
et nyt problem... Det er vist nemmest, hvis jeg bare giver dig URLen til
siden:
http://rumfart.dk/vis_test_div.asp?id=19
(Du skal se den i IE6.0 - jeg er endnu ikke gået i gang med at fikse bredder
til IE5.0 og 5.5...)
Som du kan se, når den midterste grønne linje ikke helt ned til bunden. Det
er fordi den er border på content-feltet, og content-feltet ikke er længere.
Problemet er jo, at enten skal linjen være border-left på content-feltet
(som den er nu) eller border-right på menufeltet. Ofte vil content-feltet
være længere end menufeltet, men på ovenstående URL er det jo f.eks.
omvendt.
Har du nogen gode ideer?
Nu jeg har dig: jeg har prøvet med body {margin-bottom:10px;} for at skabe
lidt luft for neden, men det virker ikke...?
(Argh - har lige opdaget, at det SLET ikke spiller i Mozilla 1.3 - Argh!)
--
Steen Eiler Jørgensen
"No, I don't think I'll ever get over Macho Grande.
Those wounds run...pretty deep."
| |
Erik Ginnerskov (09-04-2003)
| Kommentar Fra : Erik Ginnerskov |
Dato : 09-04-03 12:46 |
|
"Steen Eiler Jørgensen" <oz1sejREMOVETHIS@get2net.dk> skrev
> Okay - nu kan jeg se, hvor du vil hen - det giver god mening. Så opstår
bare
> et nyt problem... Det er vist nemmest, hvis jeg bare giver dig URLen til
> siden:
> http://rumfart.dk/vis_test_div.asp?id=19
> (Du skal se den i IE6.0 - jeg er endnu ikke gået i gang med at fikse
bredder
> til IE5.0 og 5.5...)
>
> Som du kan se, når den midterste grønne linje ikke helt ned til bunden.
Det
> er fordi den er border på content-feltet, og content-feltet ikke er
længere.
> Problemet er jo, at enten skal linjen være border-left på content-feltet
> (som den er nu) eller border-right på menufeltet. Ofte vil content-feltet
> være længere end menufeltet, men på ovenstående URL er det jo f.eks.
> omvendt.
>
> Har du nogen gode ideer?
Jeg har ikke en IE 6 installeret, men i 5.5 kan jeg også se problemet med
den grønne streg mellem menuen og sideindholdet. Hvordan ville det se ud,
hvis du både lavede en højrekant på menuen og en venstrekant på content. Det
er mit eneste umidelbare bud på problemet.
> Nu jeg har dig: jeg har prøvet med body {margin-bottom:10px;} for at skabe
> lidt luft for neden, men det virker ikke...?
Jeg ville flytte den margin-bottom til footer.
--
Med venlig hilsen
Erik Ginnerskov - erik snabela ginnerskov dot dk
http://www.hjemmesideskolen.dk - http://www.html-faq.dk
http://hjem.get2net.dk/sorgin
| |
Steen Eiler Jørgense~ (09-04-2003)
| Kommentar Fra : Steen Eiler Jørgense~ |
Dato : 09-04-03 13:02 |
|
"Erik Ginnerskov" <egin@SPAMKILLoncable.dk> skrev
> Jeg har ikke en IE 6 installeret, men i 5.5 kan jeg også se problemet med
> den grønne streg mellem menuen og sideindholdet. Hvordan ville det se ud,
> hvis du både lavede en højrekant på menuen og en venstrekant på content.
Det
> er mit eneste umidelbare bud på problemet.
Hvis jeg lavede to borders, bliver den grønne streg jo 2px bred, med
undtagelse af der, hvor der kun er en Så det duer ikke.
> > Nu jeg har dig: jeg har prøvet med body {margin-bottom:10px;} for at
skabe
> > lidt luft for neden, men det virker ikke...?
>
> Jeg ville flytte den margin-bottom til footer.
Det skulle jeg selvfølgelig have skrevet:
Jeg kan ikke flytte den til footer, for de to yderste grønne linjer er hhv.
left- og right-border på den store div, som alle disse divs ligger i, og så
ville de grønne linjer fortsætte under footeren. Jeg har derimod prøvet at
sætte marginen på den store div, men det virker heller ikke.
--
Steen Eiler Jørgensen
"No, I don't think I'll ever get over Macho Grande.
Those wounds run...pretty deep."
| |
Erik Ginnerskov (09-04-2003)
| Kommentar Fra : Erik Ginnerskov |
Dato : 09-04-03 13:15 |
|
"Steen Eiler Jørgensen" <oz1sejREMOVETHIS@get2net.dk> skrev
> > > Nu jeg har dig: jeg har prøvet med body {margin-bottom:10px;} for at
> skabe
> > > lidt luft for neden, men det virker ikke...?
> >
> > Jeg ville flytte den margin-bottom til footer.
>
> Det skulle jeg selvfølgelig have skrevet:
> Jeg kan ikke flytte den til footer, for de to yderste grønne linjer er
hhv.
> left- og right-border på den store div, som alle disse divs ligger i, og
så
> ville de grønne linjer fortsætte under footeren. Jeg har derimod prøvet at
> sætte marginen på den store div, men det virker heller ikke.
Så prøv at indsætte <p> </p> efter den store div, lige inden </body>
--
Med venlig hilsen
Erik Ginnerskov - erik snabela ginnerskov dot dk
http://www.hjemmesideskolen.dk - http://www.html-faq.dk
http://hjem.get2net.dk/sorgin
| |
Steen Eiler Jørgense~ (09-04-2003)
| Kommentar Fra : Steen Eiler Jørgense~ |
Dato : 09-04-03 13:36 |
|
"Erik Ginnerskov" <egin@SPAMKILLoncable.dk> skrev
> Så prøv at indsætte <p> </p> efter den store div, lige inden </body>
Ja, det går jo heller ikke, da alle andre elementer på siden er absolut
positionerede.
<p> </p> kommer så til at stå allerøverst på siden...
--
Steen Eiler Jørgensen
"No, I don't think I'll ever get over Macho Grande.
Those wounds run...pretty deep."
| |
Erik Ginnerskov (09-04-2003)
| Kommentar Fra : Erik Ginnerskov |
Dato : 09-04-03 13:42 |
|
"Steen Eiler Jørgensen" <oz1sejREMOVETHIS@get2net.dk> skrev
> "Erik Ginnerskov" <egin@SPAMKILLoncable.dk> skrev
>
> > Så prøv at indsætte <p> </p> efter den store div, lige inden
</body>
>
> Ja, det går jo heller ikke, da alle andre elementer på siden er absolut
> positionerede.
>
> <p> </p> kommer så til at stå allerøverst på siden...
Men behøver alt andet at være absolut positioneret?
Kan den store div ikke placeres på siden efter den metode, jeg har beskrevet
her:
http://www.hjemmesideskolen.dk/html/flyd.asp ?
--
Med venlig hilsen
Erik Ginnerskov - erik snabela ginnerskov dot dk
http://www.hjemmesideskolen.dk - http://www.html-faq.dk
http://hjem.get2net.dk/sorgin
| |
Steen Eiler Jørgense~ (10-04-2003)
| Kommentar Fra : Steen Eiler Jørgense~ |
Dato : 10-04-03 10:57 |
|
"Erik Ginnerskov" <egin@SPAMKILLoncable.dk> skrev
> Men behøver alt andet at være absolut positioneret?
> Kan den store div ikke placeres på siden efter den metode, jeg har
beskrevet
> her:
>
> http://www.hjemmesideskolen.dk/html/flyd.asp ?
Halli hallo - god ide! Nu har jeg fået det lille mellemrum forneden, jeg
ønskede. Jeg ved desværre stadig ikke, hvad jeg skal gøre med den grønne
linje, men jeg må finde på noget...
Mange tak for hjælpen
--
Steen Eiler Jørgensen
"No, I don't think I'll ever get over Macho Grande.
Those wounds run...pretty deep."
| |
|
|