---

Godaften

Inspireret af bogen "CSS -- HTML Utopia: Designing Without Tables
Using CSS" har jeg prøvet at lave en side, hvor menuen er foroven.

Det ser helt fint ud i Opera, men i MSIE ligner menuen trapper, og i
Mozilla jeg-ved-ikke-hvad.

http://www.foxladi.com/testcss/

Jeg har brugt denne css til den underliggende grå menu:

#menu{
   position: absolute;
   padding: 0;
   padding-bottom: 24px;
   margin=0;
   top: 100px;
   height: 1px;
   width: 60%;
   background: #A5B5C6;
   color: #000;
   float: both;
}

og dette til selve menu-knapperne:

ul#mainnav{
   list-style: none;
   margin: 0;
   padding: 0;
   background-color: #D6D6D6;
}

ul#mainnav li a:link, ul#mainnav li a:visited{
   text-decoration: none;
   display: block;
width: 7%;
   padding: 3px 3%;
   background-color: #5C6F90;
   font: bold 10pt arial, sans-serif;
   color: #fff;
   margin: 1px 1px 0 1px;
   float: left;
}

ul#mainnav li a:hover{
   background-color: #43616B;
   color: #eee;
   float: left;
}

Desværre kan jeg ikke gennemskue, hvor jeg skal lave om på koden for
at få et resultat i alle browsere, så det ligner resultatet i Opera.

Har nogen af jer en idé?
--
Britt Malka
Tilmeld dig nyhedsbrev og få gratis ebog om html - http://www.tips-og-tricks.com/ebog.html
(Svar ikke til denne e-mail-adresse. Mail slettes på serveren p.g.a. spam)

---

Britt Malka skrev i <news:rt72i0h1fd3vupc1t64lttl9hbk8g3ju3v@4ax.com>:

Jeg vil gætte på:

> ul#mainnav li a:link, ul#mainnav li a:visited{
> float: left;

istedetfor at lade dine li'er floate mod venstre,
skal du lave dem til:

display: inline;

Tag evt. et kig på:
http://css.maxdesign.com.au/listamatic/horizontal21.htm
http://css.maxdesign.com.au/listamatic/horizontal16.htm

Forøvrigt er jeg ikke *helt* begejstret for den nuværende
kodes udseende i opera heller, det femte menupunkt ligger
under det første, og dækker overskriften lidt. Så det er
godt du vil lave det bedre.

Jane - tror det virker, men har ikke testet det!
--
æbleskrog.dk
xn--bleskrog-i0a.dk

---

Goddag Jane

Tak for dit svar.

Den 18 Aug 2004 07:30:57 GMT skrev Jane
<kkgnsdlkng@hotmail.com.nejtak>:

>istedetfor at lade dine li'er floate mod venstre,
>skal du lave dem til:
>
>display: inline;

Et godt forslag. Jeg fjernede float og ændrede display, men så var
alle menuerne i venstre side oven på hinanden.

Herefter satte jeg float på igen, og så var problemet der igen

Jeg er blevet foreslået at fjerne UL og LI, og bare bruge <span>,og
det er nok vejen frem.

>http://css.maxdesign.com.au/listamatic/horizontal21.htm
>http://css.maxdesign.com.au/listamatic/horizontal16.htm

Hov, ja, der virker det jo fint! Jeg må se, hvad der er forskelligt i
min css og deres. Tak for linkene.

>Forøvrigt er jeg ikke *helt* begejstret for den nuværende
>kodes udseende i opera heller, det femte menupunkt ligger
>under det første, og dækker overskriften lidt. Så det er
>godt du vil lave det bedre.

Ja, det gør det ikke i min, men det har nok noget med skærmopløsning
at gøre. Det duer ikke, det har du ret i.

>Jane - tror det virker, men har ikke testet det!

Man kan heller ikke nå alt.
--
Britt Malka
Tilmeld dig nyhedsbrev og få gratis ebog om html - http://www.tips-og-tricks.com/ebog.html
(Svar ikke til denne e-mail-adresse. Mail slettes på serveren p.g.a. spam)

---

Britt Malka skrev i <news:uu96i0d300g15npu4alc9tbun3m9pmv434@4ax.com>:

> Hov, ja, der virker det jo fint! Jeg må se, hvad der er forskelligt i
> min css og deres. Tak for linkene.

Kan det være fordi du definerer a på li på ul
istedetfor at have et css punkt specifik om li måske?

Altså du har
ul#mainnav li a:link, ul#mainnav li a:visited{
istedetfor bare at have noget med:
li {

Jane - kan ikke lige gennemskue fejlen
--
æbleskrog.dk
xn--bleskrog-i0a.dk

---

Goddag Jane

Den 18 Aug 2004 10:27:15 GMT skrev Jane
<kkgnsdlkng@hotmail.com.nejtak>:

>Jane - kan ikke lige gennemskue fejlen

Det kunne jeg heller ikke, så jeg startede helt forfra med de links,
du havde givet mig, og det lykkedes Nu er menuen -- sådan da -- på
plads.

Se bare her: http://www.foxladi.com/testcss/

Tusind tak for de to links
--
Britt Malka
Tilmeld dig nyhedsbrev og få gratis ebog om html - http://www.tips-og-tricks.com/ebog.html
(Svar ikke til denne e-mail-adresse. Mail slettes på serveren p.g.a. spam)

---

Britt Malka wrote:

> så jeg startede helt forfra med de links,
> du havde givet mig, og det lykkedes Nu er menuen -- sådan da -- på
> plads.

Det er kun fint i Opera. I MSIE udløses en vandret scroll ved browserbredde
under 1000 px. I Mozilla er der vandret scroll uandset browserbredde og
menuen er forskudt mod højre i forhold til indholdsboksen (jo større
browserbredde des større forskydning).

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

---

Goddag Erik Ginnerskov

Den Wed, 18 Aug 2004 20:34:17 +0200 skrev "Erik Ginnerskov"
<erik@donotspammmeplease.invalid>:

>Det er kun fint i Opera. I MSIE udløses en vandret scroll ved browserbredde
>under 1000 px. I Mozilla er der vandret scroll uandset browserbredde og
>menuen er forskudt mod højre i forhold til indholdsboksen (jo større
>browserbredde des større forskydning).

Argh!

Tilbage til tegnebrædtet

Tak for din tilbagemelding.

Måske skal jeg bare sætte scroll=no eller hvad koden nu hedder?
--
Britt Malka
Tilmeld dig nyhedsbrev og få gratis ebog om html - http://www.tips-og-tricks.com/ebog.html
(Svar ikke til denne e-mail-adresse. Mail slettes på serveren p.g.a. spam)

---

Britt Malka wrote:

> Argh!
>
> Tilbage til tegnebrædtet
>
> Tak for din tilbagemelding.
>
> Måske skal jeg bare sætte scroll=no eller hvad koden nu hedder?

Eller lade være med at indsætte menuen med absolut positionering. Ydermere
er det ikke den div, der indeholder menuen, som du positionerer, men den
liste i div'en, som udgør menuen.

Prøv at flytte kildekoden til menuen (inklusive div'en) op under din header.
Og tildel så menu-div'en margin-left:auto;margin-right:auto;

Eller undlad helt at have en div rundt om menu-ul'en og sæt venstre/højre
margin på ul.

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

---

Goddag Erik Ginnerskov

Den Wed, 18 Aug 2004 21:29:06 +0200 skrev "Erik Ginnerskov"
<erik@donotspammmeplease.invalid>:

>Eller lade være med at indsætte menuen med absolut positionering.

Ja, det var for at undgå at have den foroven i dokumentet. Jeg ville
godt undgå at have det som den første tekst i søgemaskiner.

>Ydermere
>er det ikke den div, der indeholder menuen, som du positionerer, men den
>liste i div'en, som udgør menuen.

Jamen, hvor kan jeg ellers sætte den?

>Prøv at flytte kildekoden til menuen (inklusive div'en) op under din header.
>Og tildel så menu-div'en margin-left:auto;margin-right:auto;

Jeg prøvede at tilføje det til #navcontainer ul { men det var en
katastrofe.

Menuen har jeg nu flyttet op, og hos mig ser den fin ud i Opera, MSIE
og Mozilla.
--
Britt Malka
Tilmeld dig nyhedsbrev og få gratis ebog om html - http://www.tips-og-tricks.com/ebog.html
(Svar ikke til denne e-mail-adresse. Mail slettes på serveren p.g.a. spam)

---

Britt Malka wrote:

> Menuen har jeg nu flyttet op, og hos mig ser den fin ud i Opera, MSIE
> og Mozilla.

Meget bedre. Nu skal du bare finde årsagen til den vandrette scroll i MSIE
ved mindre browserbredde end ca. 1000 px.

Og hvis du vil af med luften over og under menuen, skal du nok sætte
margin-top og margin-bottom til 0 på #navlist.

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

---

Goddag Erik Ginnerskov

Den Wed, 18 Aug 2004 21:53:36 +0200 skrev "Erik Ginnerskov"
<erik@donotspammmeplease.invalid>:

>Meget bedre.

Tak

>Nu skal du bare finde årsagen til den vandrette scroll i MSIE
>ved mindre browserbredde end ca. 1000 px.

Ja

Problemet er, at jeg ikke kan genskabe problemet her. I MSIE 6.0.2600
laver den et tomt felt i venstre side af menulinjen, men i MSIE
6.0.2800 gør den ikke.

Jeg har prøvet at køre bredden helt ind, og jeg får ingen vandret
scroll. (Jo, i bunden, men det er vel ikke det, du mener?)

>Og hvis du vil af med luften over og under menuen, skal du nok sætte
>margin-top og margin-bottom til 0 på #navlist.

Den burde være væk nu, den luft. Jeg ved ikke helt, hvad der skete,
men det var noget med margin.
--
Britt Malka
Tilmeld dig nyhedsbrev og få gratis ebog om html - http://www.tips-og-tricks.com/ebog.html
(Svar ikke til denne e-mail-adresse. Mail slettes på serveren p.g.a. spam)

---

Britt Malka wrote:

> Jeg har prøvet at køre bredden helt ind, og jeg får ingen vandret
> scroll. (Jo, i bunden, men det er vel ikke det, du mener?)

Jo, det er netop den. ;)

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

---

Goddag Erik Ginnerskov

Den Thu, 19 Aug 2004 01:50:48 +0200 skrev "Erik Ginnerskov"
<erik@donotspammeplease.invalid>:

>> Jeg har prøvet at køre bredden helt ind, og jeg får ingen vandret
>> scroll. (Jo, i bunden, men det er vel ikke det, du mener?)
>
>Jo, det er netop den. ;)

Synes du ikke, at den skal være der?
--
Britt Malka
Tilmeld dig nyhedsbrev og få gratis ebog om html - http://www.tips-og-tricks.com/ebog.html
(Svar ikke til denne e-mail-adresse. Mail slettes på serveren p.g.a. spam)

---

Britt Malka wrote:

>>> Jeg har prøvet at køre bredden helt ind, og jeg får ingen vandret
>>> scroll. (Jo, i bunden, men det er vel ikke det, du mener?)
>>
>> Jo, det er netop den. ;)
>
> Synes du ikke, at den skal være der?

IMHO har det ikke nogen praktisk funktion at lave sider med vandret scroll.
Det er snarere et irritationsmoment.

I øvrigt har du lige nu fået indsat en pink tekstboks halvt nede på siden og
så langt ude til højre, at selv Mozilla får vandret scroll ved 800 px.

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

---

Goddag Erik Ginnerskov

Den Thu, 19 Aug 2004 15:00:59 +0200 skrev "Erik Ginnerskov"
<erik@donotspammmeplease.invalid>:

>IMHO har det ikke nogen praktisk funktion at lave sider med vandret scroll.
>Det er snarere et irritationsmoment.

O.k., men det burde være let at fjerne.

>I øvrigt har du lige nu fået indsat en pink tekstboks halvt nede på siden og
>så langt ude til højre, at selv Mozilla får vandret scroll ved 800 px.

Ja, det var bare en test.

Nu har jeg ikke haft tid at rode med det i dag, men i går aftes satte
jeg et billede på foroven, men så rykkede menubjælken sig
--
Britt Malka
Tilmeld dig nyhedsbrev og få gratis ebog om html - http://www.tips-og-tricks.com/ebog.html
(Svar ikke til denne e-mail-adresse. Mail slettes på serveren p.g.a. spam)

---

>>Det er kun fint i Opera. I MSIE udløses en vandret scroll ved browserbredde
>>under 1000 px. I Mozilla er der vandret scroll uandset browserbredde og
>>menuen er forskudt mod højre i forhold til indholdsboksen (jo større
>>browserbredde des større forskydning).

>Måske skal jeg bare sætte scroll=no eller hvad koden nu hedder?

Jeg kan ikke få nogen scroll frem i MSIE nu (men jeg har også sat
overflow: none), men den ser herrens ud i Mozilla!

Både css og html validerer
--
Britt Malka
Tilmeld dig nyhedsbrev og få gratis ebog om html - http://www.tips-og-tricks.com/ebog.html
(Svar ikke til denne e-mail-adresse. Mail slettes på serveren p.g.a. spam)