---

Godaften

Jeg er i gang med at lave nyt layout på en af mine hjemmesider, og til
det formål vil jeg gerne i størst mulig grad bruge stylesheets.

Desværre er browserne jo ikke helt enige om, hvordan CSS skal vises,
og min side, der ser fin ud i Avant Browser og MSIE, ser kun
nogenlunde ud i Opera og slem i Mozilla.

Jeg har kun brugt godkendt CSS og HTML.

Til at styre menuen i højre side har jeg brugt:

..menuright {
   position: absolute;
   margin-left: 10px;
   margin-right: 20px;
   margin-top: 20px;
   left: 605px;
   width: 140px;
   height: 100%;
   font-size: x-small;
   color: black;
   font-family: arial, verdana;
   text-align: left;
   float: right;
}


Hvis jeg fjerner margin-top, så er den god i Opera.

Er jeg virkelig nødt til evt. at have et javascript, der omdirigerer
Opera-brugere til en side, der bruger et alternativt stylesheet?

Min begyndelse - og hopperiet - kan ses på:
http://www.tips-og-tricks.com/nyside/index.html
--
Med venlig hilsen
Britt Malka

Få Tips & Tricks og ny inspiration til hjemmesiden m.m. - www.tips-og-tricks.com/tilmeld.html

---

Britt Malka skrev:

>Hvis jeg fjerner margin-top, så er den god i Opera.

Hvad er problemet i Opera? Jeg har kikket med 6.05 og 7.20.

--
Bertel
http://bertel.lundhansen.dk/   FIDUSO: http://fiduso.dk/

---

On Mon, 06 Oct 2003 19:10:43 +0200, Bertel Lund Hansen
<nospamius@lundhansen.dk> wrote:

>Hvad er problemet i Opera? Jeg har kikket med 6.05 og 7.20.

De to kolonner - i venstre og højre side - burde starte lige langt
oppe. Det gør de ikke i Opera. Ikke i min i hvert fald, og det er også
en version 7.20.
--
Med venlig hilsen
Britt Malka

Få Tips & Tricks og ny inspiration til hjemmesiden m.m. - www.tips-og-tricks.com/tilmeld.html

---

Britt Malka skrev:

>De to kolonner - i venstre og højre side - burde starte lige langt
>oppe.

Nåh ja.

Stylesheet:
<div class="menu">
<div class="menuwebmaster">Webmaster</div>

Må man godt have en DIV inden i en anden?

W3C's validator viste et par kryptiske fejl da jeg validerede dit
CSS, men jeg kunne ikke se relevansen:

Errors
URI : http://www.tips-og-tricks.com/nyside/style/screen.css
Line: 0 Context : #links a:hover span

Invalid number : leftonly 0 can be a length. You must put an unit
after your number : 170
Line: 0 Context : #internet a:hover span

Invalid number : leftonly 0 can be a length. You must put an unit
after your number : 310

Warnings
URI : http://www.tips-og-tricks.com/nyside/style/screen.css
Line : 0 font-family: You are encouraged to offer a generic
family as a last alternative

--
Bertel
http://bertel.lundhansen.dk/   FIDUSO: http://fiduso.dk/

---

On Mon, 06 Oct 2003 22:55:28 +0200, Bertel Lund Hansen
<nospamius@lundhansen.dk> wrote:

>Stylesheet:
><div class="menu">
><div class="menuwebmaster">Webmaster</div>
>
>Må man godt have en DIV inden i en anden?

Eh, det ved jeg faktisk ikke. Jeg har ikke læst noget om, at man ikke
må, men det kan da være...

Men "menuwebmaster" er kommet på, efter at fejlen opstod.

Faktisk er det sjovt, for i TopStyle der er "menuright" også lidt
længere nede end i "menu", så måske er det Opera og Mozilla, der viser
CSS korrekt

>W3C's validator viste et par kryptiske fejl da jeg validerede dit
>CSS, men jeg kunne ikke se relevansen:

Ups... men den havde jeg lavet, efter at jeg postede her, og det
ændrede ikke på problemet. Nu er fejlen rettet, altså den, du
refererer til her. Nu validerer siden igen.
--
Med venlig hilsen
Britt Malka

Få Tips & Tricks og ny inspiration til hjemmesiden m.m. - www.tips-og-tricks.com/tilmeld.html

---

foxi@foxladi.com (Britt Malka) skrev :

>On Mon, 06 Oct 2003 22:55:28 +0200, Bertel Lund Hansen
><nospamius@lundhansen.dk> wrote:

>>Må man godt have en DIV inden i en anden?

>Eh, det ved jeg faktisk ikke. Jeg har ikke læst noget om, at man ikke
>må, men det kan da være...

Jo, det må man godt.
--
Knud

---

On Mon, 06 Oct 2003 23:59:45 +0200, Knud Gert Ellentoft
<ellentoft@mail.tele.invalid> wrote:

>Jo, det må man godt.

Pyh... tak For jeg har mange inde i hinanden.
--
Med venlig hilsen
Britt Malka

Få Tips & Tricks og ny inspiration til hjemmesiden m.m. - www.tips-og-tricks.com/tilmeld.html

---

foxi@foxladi.com (Britt Malka) skrev :

>Pyh... tak For jeg har mange inde i hinanden.

Kan tilføje, men du må f.eks. ikke have en <div> i en <p> eller
en <h1> i en <p>.

Med undtagelse af <div>, må man ikke have et blokelement inde i
et andet blokelement.
--
Knud

---

foxi@foxladi.com (Britt Malka) skrev :

>Min begyndelse - og hopperiet - kan ses på:

Den eneste forskel, jeg kan se, er at der er mere luft mellem de
forskellige menuer i Opera.

I IE 6 og Mozilla 1.4 ser de ens ud.

Den luft ville jeg falde op og ned på, jeg kan ikke se, at det
generer og ødelægger da ikke designet.
--
Knud

---

Knud Gert Ellentoft skrev:

> Den eneste forskel, jeg kan se, er at der er mere luft mellem de
> forskellige menuer i Opera.

Det er ikke tilfældet her.

> I IE 6 og Mozilla 1.4 ser de ens ud.

Ikke her. I IE står logoet et stykke over den kulørte linje i
bunden. I Opera (7.20) er logoet rykket ned så det nærmest står på
den kulørte linje (der dog er skjult under selve logoet). Og i
Mozilla er logoet endnu længere nede - desuden mangler højre side
af den kulørte linje i bunden.

Hvis man vil have større ensartethed i forskellige browsere, er det
første man skal gøre som sædvanlig at benytte en stadardsættende
doctype.

Der er skrevet ganske meget om doctype switching i denne gruppe.
Her er de to links jeg plejer at give:
   <http://gutfeldt.ch/matthias/articles/doctypeswitch.html>
   <http://html.dk/artikler/00036/>
--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

---

On Mon, 06 Oct 2003 21:02:42 +0200, Jens Gyldenkærne Clausen
<jens@gyros.invalid> wrote:

>Ikke her. I IE står logoet et stykke over den kulørte linje i
>bunden. I Opera (7.20) er logoet rykket ned så det nærmest står på
>den kulørte linje (der dog er skjult under selve logoet). Og i
>Mozilla er logoet endnu længere nede - desuden mangler højre side
>af den kulørte linje i bunden.

Lige præcis det samme som det, jeg ser. Hvordan kan vi få så
forskellige resultater med de samme browsere? Indstillingerne?
--
Med venlig hilsen
Britt Malka

Få Tips & Tricks og ny inspiration til hjemmesiden m.m. - www.tips-og-tricks.com/tilmeld.html

---

On Mon, 06 Oct 2003 19:51:58 +0200, Knud Gert Ellentoft
<ellentoft@mail.tele.invalid> wrote:

>Den eneste forskel, jeg kan se, er at der er mere luft mellem de
>forskellige menuer i Opera.

Det er da underligt... I min Opera 7.20 starter højre kolonne længere
nede end venstre, ellers er den ok.

>I IE 6 og Mozilla 1.4 ser de ens ud.

I min Mozilla 1.4 gør kolonnen det samme, og desuden slutter
stjernerne meget tidligere for oven, og der er næsten ingen stjerner i
bunden.

Både i Opera og Mozilla dækker giffen "Tips&Tricks" nogen af
stjernerne.

>Den luft ville jeg falde op og ned på, jeg kan ikke se, at det
>generer og ødelægger da ikke designet.

Ja, hvis det er det eneste, så pyt...
--
Med venlig hilsen
Britt Malka

Få Tips & Tricks og ny inspiration til hjemmesiden m.m. - www.tips-og-tricks.com/tilmeld.html

---

foxi@foxladi.com (Britt Malka) skrev :

>Det er da underligt... I min Opera 7.20 starter højre kolonne længere
>nede end venstre, ellers er den ok.

Du har helt ret, havde nok lidt for travlt, da jeg tjekkede det
første gang.
--
Knud

---

On Mon, 06 Oct 2003 22:02:41 +0200, Knud Gert Ellentoft
<ellentoft@mail.tele.invalid> wrote:

>Du har helt ret, havde nok lidt for travlt, da jeg tjekkede det
>første gang.

Fint, så er fejlen måske ikke så iøjnefaldende endda
--
Med venlig hilsen
Britt Malka

Få Tips & Tricks og ny inspiration til hjemmesiden m.m. - www.tips-og-tricks.com/tilmeld.html

---

Hvad med at starte med at validere det, det hjælper tit.
Jeg kan godt se at tips og triks dækker noget af den ene streg I Opera, men jeg synes egentligt
det ser bedre ud. Hvis dine streger er meget vigtige, kan du jeg lave dem med hr eller div. Så
bliver de ihverfald ikke overskrvet.

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

---

Lobais skrev:

>Hvad med at starte med at validere det, det hjælper tit.

Koden er valideret. I CSS-arket var der indført et par fejl
senere, men de havde ikke noget med problemet at gøre.

--
Bertel
http://bertel.lundhansen.dk/   FIDUSO: http://fiduso.dk/

---

On Tue, 7 Oct 2003 05:30:33 +0000 (UTC), Lobais <1@3.be> wrote:

>Jeg kan godt se at tips og triks dækker noget af den ene streg I Opera, men jeg synes egentligt
>det ser bedre ud.



Så er det jo ikke så slemt.

>Hvis dine streger er meget vigtige, kan du jeg lave dem med hr eller div. Så
>bliver de ihverfald ikke overskrvet.

Nej, jeg vil have mine stjerner og jeg foretrækker dem som tekst
og ikke grafik. Måske - sandsynligvis - er jeg lidt for stædig her, så
jeg ville foretrække, hvis problemet kunne løses på anden vis.

Nu, hvis gæsten ikke opfatter hverken stjerner eller skævhed som et
problem, så har jeg jo sådan set heller ikke noget problem.
--
Med venlig hilsen
Britt Malka

Få Tips & Tricks og ny inspiration til hjemmesiden m.m. - www.tips-og-tricks.com/tilmeld.html

---

> Nej, jeg vil have mine stjerner og jeg foretrækker dem som tekst
> og ikke grafik.

Ahh, det er tekst, det havde jeg slet ikke set, jeg troede det var et baggrunds billede.
Har du så et serverside, js, der gernerer tilfældge farver og størelser?

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

---

On Tue, 7 Oct 2003 14:55:29 +0000 (UTC), Lobais <1@3.be> wrote:

>Ahh, det er tekst, det havde jeg slet ikke set, jeg troede det var et baggrunds billede.
>Har du så et serverside, js, der gernerer tilfældge farver og størelser?

Nej, det er lavet med Stylesheets.

Det kan garanteret laves fiksere, men lige nu har jeg oprettet 8
klasser - en til hver stjerne - med 8 forskellige farver, som jeg har
brugt til dem. Så de vælges ikke tilfældigt.
--
Med venlig hilsen
Britt Malka

Få Tips & Tricks og ny inspiration til hjemmesiden m.m. - www.tips-og-tricks.com/tilmeld.html

---

Britt Malka skrev:

> så jeg ville foretrække, hvis problemet kunne løses på anden vis.

Som nævnt tidligere - brug en standardsættende doctype.
--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

---

On Tue, 07 Oct 2003 11:05:51 +0200, Jens Gyldenkærne Clausen
<jens@gyros.invalid> wrote:

>Som nævnt tidligere - brug en standardsættende doctype.

Jeg ved ikke, hvorfor jeg overhovedet ikke havde lagt mærke til dit
udmærkede råd og de to gode links. Især den danske side er god. Måske
var jeg for fokuseret på, at du ikke kunne se nogen forskel på siden i
de forskellige browsere? Jeg har i hvert fald ingen anden
undskyldning.

Nu har jeg så gode lidt med standardsættende doctyper, og det var
lærerigt, og jeg vil bruge det fremover, men desværre har det ikke
hjulpet på resultatet, hvilket egentligt undrer mig efter at have læst
forklaringerne på doctyperne.

Jeg har indsat følgende:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

Dokumentet validerer. Jeg har også prøvet med strict, hvor det ikke
validerede, men heller ikke gjorde nogen forskel i browserne.

Jeg har ændret font-size på stjernerne fra x-small til 0.8em, og det
hjalp på den øverste række, men ikke den nederste, men jeg går ud fra,
at det har noget med "arvefølgen" at gøre. Det skal jeg lige have set
på.
--
Med venlig hilsen
Britt Malka

Få Tips & Tricks og ny inspiration til hjemmesiden m.m. - www.tips-og-tricks.com/tilmeld.html

---

Britt Malka skrev:

> Nu har jeg så gode lidt med standardsættende doctyper, og det
> var lærerigt, og jeg vil bruge det fremover, men desværre har
> det ikke hjulpet på resultatet, hvilket egentligt undrer mig
> efter at have læst forklaringerne på doctyperne.

Det kan være svært at se hvad der egentlig gør forskellen. Typisk
er det ved definitioner af højde og bredde kombineret med kanter at
der viser sig en forskel.

> Dokumentet validerer.

....næsten.

Du har et p-element inde i pre (linje 55) - det må man ikke.


> Jeg har ændret font-size på stjernerne fra x-small til 0.8em,
> og det hjalp på den øverste række, men ikke den nederste, men
> jeg går ud fra, at det har noget med "arvefølgen" at gøre.

Du har ganske ret. Den øverste række er en masse span-elementer
placeret direkte under body. Den nederste række er pakket ind i en
pre - og vil derfor arve fontegenskaber herfra. 0.8em betyder 80 %
af det omgivende elements fontstørrelse - så hvis
standardindstillingen for pre er mindre end standardindstillingen
for body vil det gå galt.

Men hvis de to linjer skal være ens, skulle de vel også være i
(eller uden for) pre begge to.
--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

---

On Tue, 07 Oct 2003 15:15:02 +0200, Jens Gyldenkærne Clausen
<jens@gyros.invalid> wrote:

>Det kan være svært at se hvad der egentlig gør forskellen. Typisk
>er det ved definitioner af højde og bredde kombineret med kanter at
>der viser sig en forskel.

O.k.

>> Dokumentet validerer.
>
>...næsten.
>
>Du har et p-element inde i pre (linje 55) - det må man ikke.

Jeg eksperimenterede lidt. Nu er det væk igen.

Jeg fik stjernerne i orden ved at ændre størrelsen til

   font-size: 12px;
   
og indsætte disse to linjer:

   font-size-adjust: none;
   letter-spacing: normal;

Tilbage er der kun "hoppet" med højre spalte, og så det, at Opera og
Mozilla fortolker mellemrummet imellem menuerne forskelligt.
--
Med venlig hilsen
Britt Malka

Få Tips & Tricks og ny inspiration til hjemmesiden m.m. - www.tips-og-tricks.com/tilmeld.html