---

Jeg er i gang med en hjemmeside - www.test.lotusweb.fr - og mit
udgangspunkt i kodning og udseende er Mozilla Firefox. Så der er
den pæn, tillige med Chrome, Safari og IE8, der dog driller på en
bagatel. Og alt validerer! Men med IE7, som mange almindelige
brugere må formodes at have på deres PC går det helt galt ://///
Tekst flyder langt ud over boksene....
Og jeg kan ikke gennemskue hvad det er. Kan nogle hjælpe mig,
ville jeg være rigtig glad.

På forhånd tak

Birgitte Sørensen

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

---

birgitte sørensen wrote in dk.edb.internet.webdesign.html:
> Jeg er i gang med en hjemmeside - www.test.lotusweb.fr - og mit
> udgangspunkt i kodning og udseende er Mozilla Firefox. Så der er
> den pæn, tillige med Chrome, Safari og IE8, der dog driller på en
> bagatel. Og alt validerer! Men med IE7, som mange almindelige
> brugere må formodes at have på deres PC går det helt galt ://///
> Tekst flyder langt ud over boksene....
> Og jeg kan ikke gennemskue hvad det er. Kan nogle hjælpe mig,
> ville jeg være rigtig glad.
>
> På forhånd tak
>
> Birgitte Sørensen
>
> --
> Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
> - Pædagogiske tutorials på dansk
> - Kom godt i gang med koderne
> KLIK HER! => http://www.html.dk/tutorials


Jeg har læst Jørgen Jensens artikel om X-UA Metamarkøren. Den tager
udgangspunkt i IE7 og fastlåser opefter. Hvad med den anden vej?

Venlige hilsner
Birgitte Sørensen


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

---

birgitte sørensen skrev:
> birgitte sørensen wrote in dk.edb.internet.webdesign.html:
>> Jeg er i gang med en hjemmeside - www.test.lotusweb.fr - og mit
>> udgangspunkt i kodning og udseende er Mozilla Firefox. Så der er
>> den pæn, tillige med Chrome, Safari og IE8, der dog driller på en
>> bagatel. Og alt validerer! Men med IE7, som mange almindelige
>> brugere må formodes at have på deres PC går det helt galt ://///
>> Tekst flyder langt ud over boksene....
>> Og jeg kan ikke gennemskue hvad det er. Kan nogle hjælpe mig,
>> ville jeg være rigtig glad.

Dine småtekster mangler sikkert en bredde. IE7 har mange problemer med
bredder, så der må du prøve dig frem. Hvis du klikker på
"Kompatibilitetsvisning" i IE8 og vælger "Udviklingsværktøjer", kan du
få en idé om, hvor det går galt - måske. I hvert fald kan du se
størrelser på de forskellige elementer, som IE7 opfatter det.

> Jeg har læst Jørgen Jensens artikel om X-UA Metamarkøren. Den tager
> udgangspunkt i IE7 og fastlåser opefter. Hvad med den anden vej?

Du kan ikke fastlåse til højere version end den, brugeren kører, det må
synes naturligt...

Jeg gentager iøvrigt, hvad jeg har skrevet før. Du har _meget_ padding i
top og bund, og det er ikke brugervenlgt, at man kan scrolle og få
ingenting. Jeg synes, det virker uprofessionelt, og IMØ ødelægger det et
ellers flot design. Dette ville jeg ordne før, jeg kiggede på
nogetsomhelst andet, da det er en gennemgående fejl i designet i alle
browsere. Det er muligt, det er fordi du vil centrere vertikalt, men det
er ikke den rigtige måde at gøre det på, og spørgsmålet er, om man _bør_
centrere.


MVH
Rune Jensen

---

Rune Jensen wrote in dk.edb.internet.webdesign.html:
> birgitte sørensen skrev:
> > birgitte sørensen wrote in dk.edb.internet.webdesign.html:
> >> Jeg er i gang med en hjemmeside - www.test.lotusweb.fr - og mit
> >> udgangspunkt i kodning og udseende er Mozilla Firefox. Så der er
> >> den pæn, tillige med Chrome, Safari og IE8, der dog driller på en
> >> bagatel. Og alt validerer! Men med IE7, som mange almindelige
> >> brugere må formodes at have på deres PC går det helt galt ://///
> >> Tekst flyder langt ud over boksene....
> >> Og jeg kan ikke gennemskue hvad det er. Kan nogle hjælpe mig,
> >> ville jeg være rigtig glad.
>
> Dine småtekster mangler sikkert en bredde. IE7 har mange problemer med
> bredder, så der må du prøve dig frem. Hvis du klikker på
> "Kompatibilitetsvisning" i IE8 og vælger "Udviklingsværktøjer", kan du
> få en idé om, hvor det går galt - måske. I hvert fald kan du se
> størrelser på de forskellige elementer, som IE7 opfatter det.
>
> > Jeg har læst Jørgen Jensens artikel om X-UA Metamarkøren. Den tager
> > udgangspunkt i IE7 og fastlåser opefter. Hvad med den anden vej?
>
> Du kan ikke fastlåse til højere version end den, brugeren kører, det må
> synes naturligt...
>
> Jeg gentager iøvrigt, hvad jeg har skrevet før. Du har _meget_ padding i
> top og bund, og det er ikke brugervenlgt, at man kan scrolle og få
> ingenting. Jeg synes, det virker uprofessionelt, og IMØ ødelægger det et
> ellers flot design. Dette ville jeg ordne før, jeg kiggede på
> nogetsomhelst andet, da det er en gennemgående fejl i designet i alle
> browsere. Det er muligt, det er fordi du vil centrere vertikalt, men det
> er ikke den rigtige måde at gøre det på, og spørgsmålet er, om man _bør_
> centrere.
>
>
> MVH
> Rune Jensen

Hej Rune,

Ja, mit design er centreret vertikalt efter et ønske fra kunden. Det er
faktisk ham der har "tegnet" designet. Så jeg vil da drøfte med ham om han
vil have fuld side vertikalt. Det bør dog ikke være problemet, da jeg har
lavet mange sider efter den model, og som vises fint i IE7. Desuden er det
ikke lavet med padding med med margin-top - hvilket jeg også mener er den
korrekte måde at positionere et <div> element på. Jeg har nu også forsøgt
med bredde på tekstbokse og det er helt givet, at IE7 læser koden
anderledes end de øvrige browsere....

Venlige hilsner
Birgitte Sørensen


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

---

birgitte sørensen wrote:

> Ja, mit design er centreret vertikalt efter et ønske fra kunden. Det er
> faktisk ham der har "tegnet" designet. Så jeg vil da drøfte med ham om han
> vil have fuld side vertikalt. Det bør dog ikke være problemet, da jeg har
> lavet mange sider efter den model, og som vises fint i IE7. Desuden er det
> ikke lavet med padding med med margin-top - hvilket jeg også mener er den
> korrekte måde at positionere et<div> element på. Jeg har nu også forsøgt
> med bredde på tekstbokse og det er helt givet, at IE7 læser koden
> anderledes end de øvrige browsere....

Faktum er bare at det /ikke/ er vertikalt centreret. Det er sådan set
bare 'ikke helt i toppen', og din metode forudsætter en bestemt
skærmstørrelse. Se f.eks.: http://grab.by/2ssI og http://grab.by/2ssM.
Første screenshot er fullscreen på min eksterne monitor og det andet er
fullscreen på skærmen på min bærbare - på ingen af dem er sitet
vertikalt centreret, og på det sidste vises en scrollbar selvom
indholdet ikke er højere end viewport.

Der findes flere 'rigtige' løsninger, hvis du giver søger en gang på google.

- Peter

---

Peter Farsinsen wrote in dk.edb.internet.webdesign.html:
> birgitte sørensen wrote:
>
> > Ja, mit design er centreret vertikalt efter et ønske fra kunden. Det er
> > faktisk ham der har "tegnet" designet. Så jeg vil da drøfte med ham om han
> > vil have fuld side vertikalt. Det bør dog ikke være problemet, da jeg har
> > lavet mange sider efter den model, og som vises fint i IE7. Desuden er det
> > ikke lavet med padding med med margin-top - hvilket jeg også mener er den
> > korrekte måde at positionere et<div> element på. Jeg har nu også forsøgt
> > med bredde på tekstbokse og det er helt givet, at IE7 læser koden
> > anderledes end de øvrige browsere....
>
> Faktum er bare at det /ikke/ er vertikalt centreret. Det er sådan set
> bare 'ikke helt i toppen', og din metode forudsætter en bestemt
> skærmstørrelse. Se f.eks.: http://grab.by/2ssI og http://grab.by/2ssM.
> Første screenshot er fullscreen på min eksterne monitor og det andet er
> fullscreen på skærmen på min bærbare - på ingen af dem er sitet
> vertikalt centreret, og på det sidste vises en scrollbar selvom
> indholdet ikke er højere end viewport.
>
> Der findes flere 'rigtige' løsninger, hvis du giver søger en gang på google.
>
> - Peter

Nu har vi besluttet at lægge det op i toppen. Men jeg vil da selvfølgelig
tjekke nettet for korrekte løsninger.

Venlige hilsner
Birgitte


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

---

birgitte sørensen skrev:

> Nu har vi besluttet at lægge det op i toppen. Men jeg vil da selvfølgelig
> tjekke nettet for korrekte løsninger.

Prøv at kigge her:

http://www.webdesign101.dk/csslayout/autocentrering.php

Der er muligvis bedre metoder til vartikal centrering. Jeg ved det ikke,
bruger det ret sjældent selv.. men det kan være Jørgen kommer ind med
flere forklaringer..

;)


MVH
Rune Jensen

--
Jeps! Den _blev_ også lavet af samatha fox! (SAW)
http://www.youtube.com/watch?v=7zvT6bEqPeE
Best Eurodance:
http://1club.fm/

---

Rune Jensen skrev:
> birgitte sørensen skrev:
>
>> Nu har vi besluttet at lægge det op i toppen. Men jeg vil da selvfølgelig
>> tjekke nettet for korrekte løsninger.
>
> Prøv at kigge her:
>
> http://www.webdesign101.dk/csslayout/autocentrering.php
>
> Der er muligvis bedre metoder til vartikal centrering. Jeg ved det ikke,
> bruger det ret sjældent selv.. men det kan være Jørgen kommer ind med
> flere forklaringer..

Jeg skal måske lige forklare--

Et design, som har en af designeren beregnet whitespace i top/bund vil
kun centrere vertikalt, hvis brugeren har samme højde på browservinduet
på skærmen, som designeren. Derfor får jeg også scrollbarer vertikalt på
det nuværende design, da min skærmopløsning er mindre, og jeg ikke kan
få din højde.

Så kan man løse det ved f.eks. absolute positioning og noget fusk med
negativ margin. Det løser problemet med scrollbarer for så vidt designet
(det synlige indhold) i fuld højde, da der ikke er noget ekstra
white-space i top/bund, men hvis man gør vinduet mindre end designet i
højden, vil det blive "spist" i toppen, og man kan ikke få det tilbage
ved at scrolle.

I og for sig burde det kunne løses ved at omslutte med en DIV, som man
sætter til display:table, for indholdet kan man så vertikalt centrere
ligesom i en almindelig table. Men display:table forstås ikke af IE<8,
hvorfor man så skal ud i noget conditional comments (som er grimt).

http://www.quirksmode.org/css/display.html#table

Så hvad man er ude efter, er en metode, som ikke laver vertikal
scrollbar unødigt, dvs. man skal kunne minimere i højden til størst
mulige højde, hvor fuldt indhold er synligt og uden scrollbar, og når
der kommer én, efterhånden som vinduet gøres mindre i højden, at man så
kan scrolle til hele indholdet, ligesom løsningen skal være cross browser.

Skal jeg være ærlig, ville jeg nok (overveje at) lave det med JS (hvis
muligt), af flere årsager. JS (i dette tilfælde) vil ikke ødelægge
designet, og man vil kunne se siden også uden JS. Nu er JS normalt til
funktioner, ikke design, men lige her, hvor designet i sig selv ikke er
så krævende, ja, der ville jeg i hvert fald overveje den mulighed. Hvis
ikke findes en ren CSS crossbroser løsning, naturligvis. En
crossbrowserløsning er måske også nemmere med JS...? Og så vil man kunne
smide JSen eksternt ligesom CSS, så den ikke forstyrrer.


MVH
Rune Jensen

---

Rune Jensen wrote:

> Et design, som har en af designeren beregnet whitespace i top/bund vil
> kun centrere vertikalt, hvis brugeren har samme højde på
> browservinduet på skærmen, som designeren. Derfor får jeg også
> scrollbarer vertikalt på det nuværende design, da min skærmopløsning
> er mindre, og jeg ikke kan få din højde.

Et design med vertikal centrering lavet med noget negativ margin er noget
bæ. Er siden højere end brugerens skærm tillader, vil toppen af siden være
utilgængelig.

Og selv om det definerede sidefelt kan indeholdes i browserens viewport, vil
det næsten helt sikkert (se Jørgens eksempel
http://www.webdesign101.dk/csslayout/ex/autocentrering_4.html) udløse en
scrollbar inde midt i browservinduet. Hold for hulen fingrene fra min
scrollbar i min browser - den vil jeg altså have placeret i højre side, hvor
den plejer at være.

Lad en webside starte i toppen af browservinduet og fylde det i højden, som
indholdet betinger. Det andet fis er noget, grafikere insisterer på at
overføre fra papir til computerskærme. De har simpelthen misforstået det,
der er himmelvid forskel.

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

---

birgitte sørensen wrote:
> Jeg har læst Jørgen Jensens artikel om X-UA Metamarkøren. Den tager
> udgangspunkt i IE7 og fastlåser opefter. Hvad med den anden vej?

Vha. <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/> kan du
tvinge IE8 til at rendere sider med samme engine som bruges i IE7.

Da IE7 er lavet /før/ IE8, kan det omvendte naturligvis ikke lade sig
gøre. IE7 kan på ingen mulig måde vide, hvordan IE8 vil rendere siden.

Jeg har ganske kort kigget på dit site, men kan ikke umiddelbart se
fejlen. Det ser imidlertid ud til at problemet er padding-left på
..knapper. IE6 og 7 har mange problemer med margin og padding, så det er
muligvis her fejlen ligger. Jeg kan dog ikke huske nogen specifik bug i
forbindlse med padding på tabeller.

Du kan evt. forsøge at finde den korrekte padding og lav et stylesheet
specifikt for IE7*. Det er en grim øvelse fordi ens kode pludselig
bliver redundant, men det kan være nødvendig nogle gange.

* http://www.quirksmode.org/css/condcom.html

- Peter

---

Peter Farsinsen wrote in dk.edb.internet.webdesign.html:
> birgitte sørensen wrote:
> > Jeg har læst Jørgen Jensens artikel om X-UA Metamarkøren. Den tager
> > udgangspunkt i IE7 og fastlåser opefter. Hvad med den anden vej?
>
> Vha. <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/> kan du
> tvinge IE8 til at rendere sider med samme engine som bruges i IE7.
>
> Da IE7 er lavet /før/ IE8, kan det omvendte naturligvis ikke lade sig
> gøre. IE7 kan på ingen mulig måde vide, hvordan IE8 vil rendere siden.
>
> Jeg har ganske kort kigget på dit site, men kan ikke umiddelbart se
> fejlen. Det ser imidlertid ud til at problemet er padding-left på
> ..knapper. IE6 og 7 har mange problemer med margin og padding, så det er
> muligvis her fejlen ligger. Jeg kan dog ikke huske nogen specifik bug i
> forbindlse med padding på tabeller.
>
> Du kan evt. forsøge at finde den korrekte padding og lav et stylesheet
> specifikt for IE7*. Det er en grim øvelse fordi ens kode pludselig
> bliver redundant, men det kan være nødvendig nogle gange.
>
> * http://www.quirksmode.org/css/condcom.html
>
> - Peter

Hej Peter,

Din løsning med et stylesheet for IE7 tiltalte mig. Især efter at jeg har
testet frem og tilbage med at slette paddings og margins mest muligt, samt
regulere størrelsen på tekstboksene uden at det løste problemet. Så jeg har
lavet en IE henvisning jvf artiklen i dit link. Her har jeg indsat link til
et stylesheet kun for IE. Og sålænge der ikke er andre css links på
html-siden fungerer det også fint. Men sætter jeg det normale css link ind
også, så "overrouler" det linket til IE-stylesheet. Skal det stå et bestemt
sted?
Mit testmiljø ligger på www.test.lotusweb.dk. Jeg har angivet følgende
kode i headsektionen:
<!--[if gt IE 6]>
<link type="text/css" rel="stylesheet" href="style-ie.css">
<![endif]-->

På forhånd tak

Birgitte Sørensen

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

---

birgitte sørensen wrote:
> Din løsning med et stylesheet for IE7 tiltalte mig. Især efter at jeg har
> testet frem og tilbage med at slette paddings og margins mest muligt, samt
> regulere størrelsen på tekstboksene uden at det løste problemet. Så jeg har
> lavet en IE henvisning jvf artiklen i dit link. Her har jeg indsat link til
> et stylesheet kun for IE. Og sålænge der ikke er andre css links på
> html-siden fungerer det også fint. Men sætter jeg det normale css link ind
> også, så "overrouler" det linket til IE-stylesheet. Skal det stå et bestemt
> sted?

Ja, det skal komme efter dit generelle stylesheet. Det skal ikke
restatte det.

> Mit testmiljø ligger på www.test.lotusweb.dk. Jeg har angivet følgende
> kode i headsektionen:
> <!--[if gt IE 6]>
> <link type="text/css" rel="stylesheet" href="style-ie.css">
> <![endif]-->

Vær opmærksom på at det også vil gælde for IE8. Jeg ville bruge:

<!--[if IE 7]>
<link type="text/css" rel="stylesheet" href="style-ie.css">
<![endif]-->

- Peter

---

>
> Ja, det skal komme efter dit generelle stylesheet. Det skal ikke
> restatte det.
>
> > Mit testmiljø ligger på www.test.lotusweb.dk. Jeg har angivet følgende
> > kode i headsektionen:
> > <!--[if gt IE 6]>
&gt; > <link type="text/css" rel="stylesheet" href="style-ie.css">
&gt; > <![endif]-->
>
> Vær opmærksom på at det også vil gælde for IE8. Jeg ville bruge:
>
> <!--[if IE 7]>
&gt; <link type="text/css" rel="stylesheet" href="style-ie.css">
&gt; <![endif]-->
>
> - Peter

Tusind tak for dine tilbagemeldinger Peter - nu virker det! Og jeg er blevet
meget klogere...

Venlige hilsner
Birgitte


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

---

birgitte sørensen skrev:

>
> Tusind tak for dine tilbagemeldinger Peter - nu virker det!

Ikke i IE 8


--
Mvh. John Paulsen

www.jp-web.dk

---

jopa wrote in dk.edb.internet.webdesign.html:
> birgitte sørensen skrev:
>
> >
> > Tusind tak for dine tilbagemeldinger Peter - nu virker det!
>
> Ikke i IE 8
>
>
> --
> Mvh. John Paulsen
>
> www.jp-web.dk
>

Hej John,

Jeg manglede lige at uploade et enkelt stylesheet for
kontaktsiden - men ellers ser det da OK ud på min egen skærm....

Hvad virker ikke hos dig?

Vh
Birgitte




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

---

birgitte sørensen skrev:

> Hvad virker ikke hos dig?
Således min ven
http://wordpresstema.dk/q.jpg

--
Mvh. John Paulsen

www.wordpresstema.dk

---

jopa wrote:
> birgitte sørensen skrev:
>
>> Hvad virker ikke hos dig?
> Således min ven
> http://wordpresstema.dk/q.jpg

Den fejl ser jeg ikke i hverken 6, 7 eller 8. Har du prøvet at opdatere css
eller tømme din cache?

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

---

birgitte sørensen har bragt dette til os:
> Peter Farsinsen wrote in dk.edb.internet.webdesign.html:
>> birgitte sørensen wrote:
>>> Jeg har læst Jørgen Jensens artikel om X-UA Metamarkøren. Den tager
>>> udgangspunkt i IE7 og fastlåser opefter. Hvad med den anden vej?
>>
>> Vha. <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/> kan du
>> tvinge IE8 til at rendere sider med samme engine som bruges i IE7.
>>
>> Da IE7 er lavet /før/ IE8, kan det omvendte naturligvis ikke lade sig
>> gøre. IE7 kan på ingen mulig måde vide, hvordan IE8 vil rendere siden.
>>
>> Jeg har ganske kort kigget på dit site, men kan ikke umiddelbart se
>> fejlen. Det ser imidlertid ud til at problemet er padding-left på
>> ..knapper. IE6 og 7 har mange problemer med margin og padding, så det er
>> muligvis her fejlen ligger. Jeg kan dog ikke huske nogen specifik bug i
>> forbindlse med padding på tabeller.
>>
>> Du kan evt. forsøge at finde den korrekte padding og lav et stylesheet
>> specifikt for IE7*. Det er en grim øvelse fordi ens kode pludselig
>> bliver redundant, men det kan være nødvendig nogle gange.
>>
>> * http://www.quirksmode.org/css/condcom.html
>>
>> - Peter
>
> Hej Peter,
>
> Din løsning med et stylesheet for IE7 tiltalte mig. Især efter at jeg har
> testet frem og tilbage med at slette paddings og margins mest muligt, samt
> regulere størrelsen på tekstboksene uden at det løste problemet. Så jeg har
> lavet en IE henvisning jvf artiklen i dit link. Her har jeg indsat link til
> et stylesheet kun for IE. Og sålænge der ikke er andre css links på
> html-siden fungerer det også fint. Men sætter jeg det normale css link ind
> også, så "overrouler" det linket til IE-stylesheet. Skal det stå et bestemt
> sted?
> Mit testmiljø ligger på www.test.lotusweb.dk. Jeg har angivet følgende
> kode i headsektionen:
> <!--[if gt IE 6]>
> <link type="text/css" rel="stylesheet" href="style-ie.css">
> <![endif]-->
>
> På forhånd tak
>
> Birgitte Sørensen

Det sidst læste, er det der gælder.
Sæt link til andre først, og korriger til M$ derefter.
Så vil andre læse det rigtigt, og kun IE få tilpasningerne.

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk