---

Hej!

Jeg var lige inde og hente IE5 og IE5.5 for nu skulle min side jo gerne
køre ordentligt i alle browserne inden den bliver offentliggjort.

Ærlig talt ville jeg ønske at det eneste krav man skulle opfylde var
kompatibilitet med IE6, Opera 7 og Mozilla 1.5 - så ville verden godt
nok se lysere ud!
Men jeg kan se på min statistik at ca. 16% af de besøgende bruger IE5 -
så jeg må jo hellere få problemet rettet.

Nå, nu skal I bare høre.

Min side bruger valideret XHTML 1.0 Strict og CSS2 og virker som den
skal i Mozilla 1.5, Opera 7, IE 6.
URL: http://www.woodman.dk/ihstest

--

Problem 1:

Overskriften opfører sig meget underligt i IE5. Samme problem var i IE6
før, men jeg løste det ved at indsætte <br style="line-height: 41px;" />
hvorefter det hvide felt med underdelen af logoet blev rykket ned.

Jeg har prøvet at bytte <br /> ud med et sort billede, men det gav kun
endnu flere problemer.

Er der nogen, der har et forslag til en løsning?

--

Problem 2:

I IE5.0 og 5.5 er der et lille mellemrum mellem navigationsbaren og mit
lille stykke grafik (en gradient) umiddelbart til venstre herfor.

Det samme sker med IE6, hvis den er i Quirks-mode - men det har jeg
forhindret nu.

Løsning?

--

Tusinde tak!

Mvh,
Niels Skovmand.


"all we have to do is to decide what to do with the time given to us"
- gandalf, lord of the rings (j.r.r. tolkien)

---

Niels Skovmand wrote:
> Hej!
>
> Jeg var lige inde og hente IE5 og IE5.5 for nu skulle min side jo gerne
> køre ordentligt i alle browserne inden den bliver offentliggjort.
>

Disse 2 browsere er meget fejlbehæftet, så man skal grueligt meget igennem, hvis man ønsker at
de styler siden som nutidens browsere.
Nogle gange er det umuligt, da de simpelthen ikke understøtter en eller anden bestemt
CSS-feature. Her er det en sund indstilling, hvis du bare acceptere at det aldrig vil se 100%
ens ud på disse ældre versioner af IE. Men siden skal selvfølgelig stadig være tilgængelig for dem.


> Ærlig talt ville jeg ønske at det eneste krav man skulle opfylde var
> kompatibilitet med IE6, Opera 7 og Mozilla 1.5 - så ville verden godt
> nok se lysere ud!
> Men jeg kan se på min statistik at ca. 16% af de besøgende bruger IE5 -
> så jeg må jo hellere få problemet rettet.

Ofte skelner statistik programmer ikke imellem IE5.0 og IE5.5 og ligger dem begge under IE5.
Jeg _tror_ dog umiddelbart at flertallet har IE5.5.
Hvilket er heldigt da den er en tand bedre end sin forgænger.

>
> Nå, nu skal I bare høre.
>
> Min side bruger valideret XHTML 1.0 Strict og CSS2 og virker som den
> skal i Mozilla 1.5, Opera 7, IE 6.
> URL: http://www.woodman.dk/ihstest
>

Ja, det ser godt ud

[snip problemer]

Jeg har taget mig den frihed at lave din side om. Håber at det er okay.


Grundpillen er HTML-koden så den kigger vi på først.
http://users.cybercity.dk/~dsl58854/testcenter/css/www_woodman_dk/index.html
(Din gamle HTML-kode uden CSS)
http://users.cybercity.dk/~dsl58854/testcenter/css/www_woodman_dk/index_old.html

Først og fremmest har jeg prøvet at opstille koden mere semantisk korrekt.
D.v.s. brugt p elementer i stedet for to br elementer, sat h1 element som titel og nogle andre
småting.
Dernæst har jeg prøvet at fjerne de mange præsentation elementer som f.eks. logo'ets mange
gif-filer. (Med CSS behøver vi ikke splitte billeder)
Jeg har også fjernet en del overflødige class'es.


Og nu til den stylet side
http://users.cybercity.dk/~dsl58854/testcenter/css/www_woodman_dk/index.html

Her har jeg brugt område styling og prøvet i CSS-filen at kommentere de ting jeg syntes der var
vigtige.
Generelt har jeg brugt em som enhed til width, margin og padding, med undtagelse af #head og
#menu ul, hvor der er brugt pixels pga. baggrundsbillederne.


Der er nogle få forskelle i layout'et fra browser til browser.
Det værste er IE5.0, som ikke kan sætte padding på menu'en. (Kan måske fikses med et specielt hack)
Dernæst fremtræder den hvide baggrundsfarve fra ul'en ikke imellem li'erne hos IE6.0 og IE5.5.
Jeg har lavet et udkommenteret alternativ i stylen, men jeg syntes det var bedre uden.

Så nu har du endnu et layout med nogle fejl
Jeg syntes dog at min løsning er noget bedre, men du må jo selvom om du vil bruge det

Hintzmann c",)

---

> Og nu til den stylet side
> http://users.cybercity.dk/~dsl58854/testcenter/css/www_woodman_dk/index.html

Den bruger da ikke stylesheets?
Er du kommet til at skrive en forkert adresse?

/ Niels.

---

Hvis den ikke bruger stylesheet, hvad er så dette?
<link rel="stylesheet" type="text/css" href="stylesheet.css" />

Taget fra headeren.

Regards Jens Peter Karlsen. Microsoft MVP - Frontpage.

On Fri, 16 Jan 2004 00:34:13 +0100, Niels Skovmand
<woodman@woodman.fjerndette.dk> wrote:

>> http://users.cybercity.dk/~dsl58854/testcenter/css/www_woodman_dk/index.html
>
>Den bruger da ikke stylesheets?
>Er du kommet til at skrive en forkert adresse?

---

Jens Peter Karlsen wrote:
> Hvis den ikke bruger stylesheet, hvad er så dette?
> <link rel="stylesheet" type="text/css" href="stylesheet.css" />
>

... men hvis du nu lige læser lidt før og efter, ser du følgende:

<!--
<link rel="stylesheet" type="text/css" href="stylesheet.css" />
-->

- altså står henvisningen til stylesheetet "som kommentar" i HTML'en -
jeg kender ikke lige fagsproget til dette fænomen..

---

Det jeg mener er, at Martin Hintzmann Andersen måske har skrevet forkert
- og har en anden adresse med den stylede side.

/ Niels.

---

Niels Skovmand wrote:
> Jens Peter Karlsen wrote:
>
> Det jeg mener er, at Martin Hintzmann Andersen måske har skrevet forkert
> - og har en anden adresse med den stylede side.
>

Du har ret her kommer det rigtige link - Pinligt

http://users.cybercity.dk/~dsl58854/testcenter/css/www_woodman_dk/index_css.html

Hintzmann c",)

---

> [snip problemer]
>
> Jeg har taget mig den frihed at lave din side om. Håber at det er okay.
>

Ingen problemer!


> Først og fremmest har jeg prøvet at opstille koden mere semantisk korrekt.
> D.v.s. brugt p elementer i stedet for to br elementer, sat h1 element
> som titel og nogle andre småting.

Hvad er ideen i at opstille koden mere semantisk korrekt?
Hvilke fordele giver det? Større kompatibilitet?


> Dernæst har jeg prøvet at fjerne de mange præsentation elementer som
> f.eks. logo'ets mange gif-filer. (Med CSS behøver vi ikke splitte billeder)
> Jeg har også fjernet en del overflødige class'es.
>

Kanon godt trick! Lige hvad jeg havde brug for.

> Generelt har jeg brugt em som enhed til width, margin og padding, med
> undtagelse af #head og #menu ul, hvor der er brugt pixels pga.
> baggrundsbillederne.

Er der et problem i at bruge en fast bredde?

På samme side skal jeg alligevel lave et billedsystem - så jeg kan godt
lide at jeg ved at designet er nogenlunde ens uanset situationen.


> Der er nogle få forskelle i layout'et fra browser til browser.
> Det værste er IE5.0, som ikke kan sætte padding på menu'en. (Kan måske
> fikses med et specielt hack)

Ja, men det er ikke vigtigt - det vigtige er at den bare virker
nogenlunde i IE5.0.

"To hell with bad browsers"


> Så nu har du endnu et layout med nogle fejl
> Jeg syntes dog at min løsning er noget bedre, men du må jo selvom om du
> vil bruge det
>

Jeg vil tage ved lære af din semantik, dit stylesheet og logoføringen i
toppen - men jeg vil stadig lave nogle ting om.

Du har givet mig et godt skub i den fede retning

- Håber du vil besvare de spørgsmål jeg har skrevet nu her.

/ Niels.

---

Niels Skovmand wrote:

>
> Hvad er ideen i at opstille koden mere semantisk korrekt?
> Hvilke fordele giver det? Større kompatibilitet?
>

Fordelen ved at bruge de rigtige HTML-elementer, fremfor at smide det hele i div og span
elementer (har du dog ikke gjort), er at siden stadig er logisk opdelt selv uden styling.

- Søgemaskiner som google kan bedre vægte din side, hvis du har indelt den rigtigt.
- Ældre browsere som ikke understøtter CSS, viser siden med default-style.
- Blinde får oplæst siden rigtigt og kan springe imellem overskrift elementerne (h1-h6).
Der kommer en pause imellem afsnittene/p-elementerne. Hved to br-elementer læses det hele ud i
en kører.
- Tekst-browsere får tekst stylet elementer (f.eks. em-elementet(kursiv) får /-streger rundt om
teksten og strong(fremhævet) får * stjerner m.v.)
- HTML-koden er lettere at læses for os web-udviklere


>
>
> Er der et problem i at bruge en fast bredde?
>

Fast side bredde på 600px gør at din side fylder en "dråbe i havet" på min 22" i 1600x1200.

Fast tekst bredde gør også at IE-brugerne ikke kan gøre siden med teksten større eller mindre
("Vis/Tekststørrelse/" eller CTRL+scroll). Hvilket er rigtigt smart hvis de har svært ved at
læse indholdet.


>
> Ja, men det er ikke vigtigt - det vigtige er at den bare virker
> nogenlunde i IE5.0.
>
> "To hell with bad browsers"
>

Lige mine ord

>
> Jeg vil tage ved lære af din semantik, dit stylesheet og logoføringen i
> toppen - men jeg vil stadig lave nogle ting om.
>

Det er bare et oplæg, og det står dig frit for om du vil bruge det hele eller bare dele af det.

> Du har givet mig et godt skub i den fede retning
>

Glad for at jeg kan hjælpe

> - Håber du vil besvare de spørgsmål jeg har skrevet nu her.
>

Hermed gjort og har du flere af dem så kom bare med dem.

Hintzmann c",)