/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
Hvilken browser fortolker korrekt?
Fra : Michael Knudsen


Dato : 01-06-06 07:41

Hej,

Jeg er gået et skridt videre med mit design, som jeg har omtalt i en
tidligere tråd. Indtil videre er det ikke noget at råbe hurra for.

http://pumpemesteren.dk/test/beta002/test.php

Jeg benytter Firefox på en Linux-platform, og der ser resultatet
således ud:

http://pumpemesteren.dk/test/beta002/beta002.jpg

Nu har jeg dog set resultatet i Internet Explorer, og der stjæler
"omslaget", det er det med den gule baggrund, det meste af billedet. Nu
er spørgsmålet: Hvilken af de to browsere viser siden korrekt, og kan
det lade sig gøre at få siden til at se pæn ud i begge browsere?

--
Michael Knudsen


 
 
Tidemann (01-06-2006)
Kommentar
Fra : Tidemann


Dato : 01-06-06 11:07

"Michael Knudsen" skrev

Jeg er gået et skridt videre med mit design, som jeg har omtalt i en
tidligere tråd. Indtil videre er det ikke noget at råbe hurra for.

http://pumpemesteren.dk/test/beta002/test.php

Jeg benytter Firefox på en Linux-platform, og der ser resultatet
således ud:

http://pumpemesteren.dk/test/beta002/beta002.jpg

Nu har jeg dog set resultatet i Internet Explorer, og der stjæler
"omslaget", det er det med den gule baggrund, det meste af billedet. Nu
er spørgsmålet: Hvilken af de to browsere viser siden korrekt,

Det gør FF!

og kan
det lade sig gøre at få siden til at se pæn ud i begge browsere?

Ja..................

Men jeg kan kun få det til at virke med en anden docotype:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="da">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

Men sæt dette på også, du skal beholde det du har i forvejen:

body{
margin: 5px;
padding:0;
}
html body {
\margin:10px;
}
p, h1 {padding: 0 10px;}
#omslag {width:100%;}
#hoved {height:36px;}
#navigation{height:20px; padding:5px;}
#indhold{width:auto;}
#bund {height:38px;}


--
Venlig hilsen Marianne
design af:
www.singingwolfs.dk - www.ragdollys-cat-link.dk - www.dhejne.dk
www.formdinfremtid.dk - www.royalmontana.dk


Erik Ginnerskov (01-06-2006)
Kommentar
Fra : Erik Ginnerskov


Dato : 01-06-06 23:14

Michael Knudsen wrote:

> http://pumpemesteren.dk/test/beta002/test.php

> http://pumpemesteren.dk/test/beta002/beta002.jpg
>
> Nu har jeg dog set resultatet i Internet Explorer, og der stjæler
> "omslaget", det er det med den gule baggrund, det meste af billedet.
> Nu er spørgsmålet: Hvilken af de to browsere viser siden korrekt, og
> kan det lade sig gøre at få siden til at se pæn ud i begge browsere?

Som Marianne skriver, er det FF, der viser siden korrekt.

Men du er faktisk selv (sikkert ubevidst) skyld i, at IE viser siden
forkert. Du har øverst på siden indsat denne kodelinje:

<?xml version="1.0" encoding="UTF-8"?>

Det får IE til at gå i quirks-mode (bagudkompatibel visningsmodel). Slet den
kodelinje og indsæt i stedet denne linje efter <head> :

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

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



Michael Knudsen (02-06-2006)
Kommentar
Fra : Michael Knudsen


Dato : 02-06-06 07:35

Erik Ginnerskov wrote:

> Men du er faktisk selv (sikkert ubevidst) skyld i, at IE viser siden
> forkert. Du har ?verst p? siden indsat denne kodelinje:
>
> <?xml version="1.0" encoding="UTF-8"?>
>
> Det f?r IE til at g? i quirks-mode (bagudkompatibel visningsmodel). Slet den
> kodelinje og inds?t i stedet denne linje efter <head> :
>
> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

Tak for tippet. Siden vises (naturligvis) stadig korrekt i Firefox. Nu
ser den knap så rodet ud i Internet Explorer, men desværre mangler
overskriften og navigationsbjælken nu.

http://pumpemesteren.dk/test/beta003/test.php
http://pumpemesteren.dk/test/beta003/beta003.jpg

Hvis siden skulle ende med at være min egen personlige side (den skal
i stedet bruges af en skakklub), ville jeg vælge den arrogante
løsning http://www.explorerdestroyer.com/ ... men ak, når IE er så
udbredt, er det kombineret med et dalende medlemstal i Dansk Skak Union
ikke en god cocktail

--
Michael Knudsen


Tidemann (02-06-2006)
Kommentar
Fra : Tidemann


Dato : 02-06-06 08:51

>"Michael Knudsen" skrev
>
>Tak for tippet. Siden vises (naturligvis) stadig korrekt i Firefox. Nu
>ser den knap så rodet ud i Internet Explorer, men desværre mangler
>overskriften og navigationsbjælken nu.

>http://pumpemesteren.dk/test/beta003/test.php
>http://pumpemesteren.dk/test/beta003/beta003.jpg

>Hvis siden skulle ende med at være min egen personlige side (den skal
>i stedet bruges af en skakklub), ville jeg vælge den arrogante
>løsning http://www.explorerdestroyer.com/ ... men ak, når IE er så
>udbredt, er det kombineret med et dalende medlemstal i Dansk Skak Union
>ikke en god cocktail

Jeg gentager lige mig selv......................
Skriv dette i din css også, du skal beholde det du har i forvejen:

body{
margin: 5px;
padding:0;
}
html body { */ Dette er et IE hack /*
\margin:10px;
}
p, h1 {padding: 0 10px;}
#omslag {width:100%;}
#hoved {height:36px;}
#navigation{height:20px; padding:5px;}
#indhold{width:auto;}
#bund {height:38px;}


--
Venlig hilsen Marianne
design af:
www.singingwolfs.dk - www.ragdollys-cat-link.dk - www.dhejne.dk
www.formdinfremtid.dk - www.royalmontana.dk


Tidemann (02-06-2006)
Kommentar
Fra : Tidemann


Dato : 02-06-06 09:01

"Michael Knudsen"

>Hvis siden skulle ende med at være min egen personlige side (den skal
>i stedet bruges af en skakklub), ville jeg vælge den arrogante
>løsning http://www.explorerdestroyer.com/ ... men ak, når IE er så
>udbredt, er det kombineret med et dalende medlemstal i Dansk Skak Union
>ikke en god cocktail


Det kunne måske gavne dig, at læse siden her:
http://www.webdesign101.dk/csslayout/float_layout.php
og vælge dette layout
http://www.webdesign101.dk/csslayout/ex/principlayout_7.html

det opfylder vist dine behov


--
Venlig hilsen Marianne
design af:
www.singingwolfs.dk - www.ragdollys-cat-link.dk - www.dhejne.dk
www.formdinfremtid.dk - www.royalmontana.dk


Denn!s H (02-06-2006)
Kommentar
Fra : Denn!s H


Dato : 02-06-06 10:12


>"Michael Knudsen" <micknudsen@gmail.com> skrev i en meddelelse
>news:1149230106.734225.251980@y43g2000cwc.googlegroups.com...


>Tak for tippet. Siden vises (naturligvis) stadig korrekt i Firefox. Nu
>ser den knap så rodet ud i Internet Explorer, men desværre mangler
>overskriften og navigationsbjælken nu.


Lige mit bidrag...

--
mvh
Denn!s H



-----


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Untitled Page</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
body { background-color: #000000; }
h1,p { margin: 0; padding: 10px; }
.bl { background: url(bl.gif) 0 100% no-repeat; position: relative; }
.br { background: url(br.gif) 100% 100% no-repeat; position: relative; }
.tl { background: url(tl.gif) 0 0 no-repeat; position: relative; }
.tr { background: url(tr.gif) 100% 0 no-repeat; position: relative; }
#omslag { background-color: yellow; width:100%; }
/*#omslag { background-color: yellow; left: 50%; margin-left: -375px;
position: relative; width: 750px; }*/
#hoved { background-color: gray; }
#navigation { background-color: orange;padding: 10px; }
#hojre { float: right;background-color: lightgreen; width: 300px; }
#indhold { background-color: lightblue; margin-right: 300px; padding:
10px; }
#bund { clear: both;background-color: gray; }
</style>
</head>
<body>
<div id="omslag">
<div id="hoved">
<div class="tl">
<div class="tr">
<h1>
Hoved</h1>
</div>
</div>
</div>
<div id="navigation">
<h1>
Navigation</h1>
<p>
Keskellä suurten voimien myllerrystä pieni hobitti Frodo Reppuli vaeltaa
kohti Mustan ruhtinaan valtakunnan sydäntä,
</p>
</div>
<div id="hojre">
<h1>
Højre</h1>
<p>
Se kertoo Sormuksen sodasta, hyvän ja pahan viimeisestä valtataistelusta
Keski-Maassa.
</p>
<p>
Se kertoo Sormuksen sodasta, hyvän ja pahan viimeisestä valtataistelusta
Keski-Maassa.
</p>
</div>
<div id="indhold">
<h1>
Indhold</h1>
<p>
Taru Sormusten Herrasta on nykyaikaisen fantasiakirjallisuuden
peruskivi..
</p>
</div>
<div id="bund">
<div class="bl">
<div class="br">
<h1>
Bund</h1>
<p>
Yksi vuosisatamme eniten luetuista kirjoista
</p>
</div>
</div>
</div>
</div>
</body>
</html>



Michael Knudsen (02-06-2006)
Kommentar
Fra : Michael Knudsen


Dato : 02-06-06 11:37

Tidemann (Slet 2You) wrote:

> Jeg gentager lige mig selv......................
> Skriv dette i din css også, du skal beholde det du har i forvejen:

Bare rolig, jeg har set dit forslag Jeg håbede bare at finde på
noget, der var lidt kønnere. De underlige valg af marginer og lignende
er jo et hack af dimensioner.

--
Michael Knudsen


Tidemann (02-06-2006)
Kommentar
Fra : Tidemann


Dato : 02-06-06 12:19

"Michael Knudsen" skrev
>Tidemann wrote:

>> Jeg gentager lige mig selv......................
>> Skriv dette i din css også, du skal beholde det du har i forvejen:

> Bare rolig, jeg har set dit forslag Jeg håbede bare at finde på
> noget, der var lidt kønnere. De underlige valg af marginer og lignende
> er jo et hack af dimensioner.

Det er da kun den her, der er et hack:

html body { */ Dette er et IE hack /*
\margin:10px;
}


--
Venlig hilsen Marianne
design af:
www.singingwolfs.dk - www.ragdollys-cat-link.dk - www.dhejne.dk
www.formdinfremtid.dk - www.royalmontana.dk


Michael Knudsen (02-06-2006)
Kommentar
Fra : Michael Knudsen


Dato : 02-06-06 11:44

Denn!s H wrote:

> #omslag { background-color: yellow; width:100%; }

Takker! Jeg har ikke nærlæst hele dit forslag ... prøvede blot at
tilføje width:100% til #omslag, og nu ser det ud til at virke.

--
Michael


Denn!s H (02-06-2006)
Kommentar
Fra : Denn!s H


Dato : 02-06-06 13:20


"Michael Knudsen" <micknudsen@gmail.com> skrev i en meddelelse
news:1149245065.569536.40110@h76g2000cwa.googlegroups.com...
>
>Takker! Jeg har ikke nærlæst hele dit forslag ... prøvede blot at
>tilføje width:100% til #omslag, og nu ser det ud til at virke.


Hvis du en finder på en anden baggrundsfarve end hvid, skal du lave dine
fire giffer transparente.
http://www.demoland.dk/test/rund_hj.htm


--
mvh
Denn!s H



Michael Knudsen (02-06-2006)
Kommentar
Fra : Michael Knudsen


Dato : 02-06-06 13:25

Denn!s H wrote:

> Hvis du en finder på en anden baggrundsfarve end hvid, skal du lave dine
> fire giffer transparente.
> http://www.demoland.dk/test/rund_hj.htm

Det er faktisk præcist det, jeg sidder og fedter med lige nu. Jeg
leder efter en god guide til, hvordan man kan lave sådan noget i
eksempelvis Gimp.

--
Michael


Denn!s H (02-06-2006)
Kommentar
Fra : Denn!s H


Dato : 02-06-06 14:43


"Michael Knudsen" <micknudsen@gmail.com> skrev i en meddelelse
news:1149251115.881868.185560@y43g2000cwc.googlegroups.com...


>Det er faktisk præcist det, jeg sidder og fedter med lige nu. Jeg
>leder efter en god guide til, hvordan man kan lave sådan noget i
>eksempelvis Gimp.

Kender ikke Gimp.

Men prøv kig nu på øverste højre hjørne
http://www.demoland.dk/test/rund_hj.htm

Hvis hjørnet er transparent vil du se baggrundsfarven på "hoved".
Så du er nok nød til at erstatte den hvide farve i hjørnet med den aktuelle
baggrundsfarve for selve sidens body.



--
mvh
Denn!s H



Tidemann (02-06-2006)
Kommentar
Fra : Tidemann


Dato : 02-06-06 14:50

"Denn!s H" <@> skrev
>
> "Michael Knudsen" skrev i en meddelelse
>
>
> >Det er faktisk præcist det, jeg sidder og fedter med lige nu. Jeg
> >leder efter en god guide til, hvordan man kan lave sådan noget i
> >eksempelvis Gimp.
>
> Kender ikke Gimp.
>
> Men prøv kig nu på øverste højre hjørne
> http://www.demoland.dk/test/rund_hj.htm
>
> Hvis hjørnet er transparent vil du se baggrundsfarven på "hoved".
> Så du er nok nød til at erstatte den hvide farve i hjørnet med den aktuelle
> baggrundsfarve for selve sidens body.
>
>
>

Han kan bare gemme hjørnerne som gif filer, f.eks. med IrfanView.
http://www.irfanview.com/

der kan man vælge, hvilken farve der skal være transparent.

--
Venlig hilsen Marianne
design af:
www.singingwolfs.dk - www.ragdollys-cat-link.dk - www.dhejne.dk
www.formdinfremtid.dk - www.royalmontana.dk


Denn!s H (02-06-2006)
Kommentar
Fra : Denn!s H


Dato : 02-06-06 15:11


"Tidemann" <tidemann@tdcadsl.dk> skrev i en meddelelse
news:4480417e$0$84030$edfadb0f@dtext01.news.tele.dk...

> Han kan bare gemme hjørnerne som gif filer, f.eks. med IrfanView.
> http://www.irfanview.com/
>
> der kan man vælge, hvilken farve der skal være transparent.

Det er ikke transparentfarven som er problemet, men det som bliver synligt
ved brug af transparens.


--
mvh
Denn!s H



Tidemann (03-06-2006)
Kommentar
Fra : Tidemann


Dato : 03-06-06 11:09

Denn!s H wrote:
>
> Men prøv kig nu på øverste højre hjørne
> http://www.demoland.dk/test/rund_hj.htm
>
> Hvis hjørnet er transparent vil du se baggrundsfarven på "hoved".

Ikke nødvendigvis

> Så du er nok nød til at erstatte den hvide farve i hjørnet med den
> aktuelle baggrundsfarve for selve sidens body.

Det behøver man ikke. Med lidt ombytning af nogle div´er kan det lade
sig gøre
http://www.ragdollys-cat-link.dk/mariannes/test.htm

mine hjørner er måske ikke helt magen til Michael´s, men de er med
transp. baggrund.

--
Venlig hilsen Marianne
design af:
www.singingwolfs.dk - www.ragdollys-cat-link.dk - www.dhejne.dk
www.formdinfremtid.dk - www.royalmontana.dk


Denn!s H (03-06-2006)
Kommentar
Fra : Denn!s H


Dato : 03-06-06 16:20


"Tidemann" <tidemann@tdcadsl.dk> skrev i en meddelelse
news:44815f22$0$84035$edfadb0f@dtext01.news.tele.dk...

>
> Det behøver man ikke. Med lidt ombytning af nogle div´er kan det lade
> sig gøre
> http://www.ragdollys-cat-link.dk/mariannes/test.htm
>
Fin løsnign.

> mine hjørner er måske ikke helt magen til Michael´s, men de er med
> transp. baggrund.

FireFox laver en pixel fejl på den negative margen.

http://www.demoland.dk/test/rund_hjc.htm


--
mvh
Denn!s H



Tidemann (03-06-2006)
Kommentar
Fra : Tidemann


Dato : 03-06-06 19:09

Denn!s H wrote:
> "Tidemann" <tidemann@tdcadsl.dk> skrev i en meddelelse
> news:44815f22$0$84035$edfadb0f@dtext01.news.tele.dk...
>
>>
>> Det behøver man ikke. Med lidt ombytning af nogle div´er kan det
lade
>> sig gøre
>> http://www.ragdollys-cat-link.dk/mariannes/test.htm
>>
> Fin løsnign.
>
>> mine hjørner er måske ikke helt magen til Michael´s, men de er med
>> transp. baggrund.
>
> FireFox laver en pixel fejl på den negative margen.
>
> http://www.demoland.dk/test/rund_hjc.htm


Er det ikke fordi dine hjørner er 12x12 og firkanten 11x11 ??
Mine hjørner er 11x11.


--
Venlig hilsen Marianne
design af:
www.singingwolfs.dk - www.ragdollys-cat-link.dk - www.dhejne.dk
www.formdinfremtid.dk - www.royalmontana.dk


Denn!s H (04-06-2006)
Kommentar
Fra : Denn!s H


Dato : 04-06-06 07:44


"Tidemann" <tidemann@tdcadsl.dk> skrev i en meddelelse
news:4481cfad$0$84026$edfadb0f@dtext01.news.tele.dk...
> Denn!s H wrote:

>
> Er det ikke fordi dine hjørner er 12x12 og firkanten 11x11 ??
> Mine hjørner er 11x11.
>
>

Nej jeg lavede dem 12x12 i forsøget på at lave en smart måde at skjule
"fejlen" på.

Jeg vil skyde på du ser det samme hvis du justere din negative margen.


--
mvh
Denn!s H



Michael Knudsen (03-06-2006)
Kommentar
Fra : Michael Knudsen


Dato : 03-06-06 09:00

Tidemann wrote:

> Han kan bare gemme hjørnerne som gif filer, f.eks. med IrfanView.
> http://www.irfanview.com/

Desværre, Irfanview ser ud til kun at findes til Wintendo. Jeg er dog
100% sikker på, at Gimp kan klare ærterne, jeg har bare endnu ikke
haft tid til at finde ud af hvordan.

--
Michael Knudsen


Kim Ludvigsen (03-06-2006)
Kommentar
Fra : Kim Ludvigsen


Dato : 03-06-06 09:38

Den 03-06-06 10.00 skrev Michael Knudsen følgende:

> Desværre, Irfanview ser ud til kun at findes til Wintendo. Jeg er dog
> 100% sikker på, at Gimp kan klare ærterne, jeg har bare endnu ikke
> haft tid til at finde ud af hvordan.

Du kan sikkert få hjælp i dk.edb.grafik. Men et gæt: Gem filen som gif.
I gem-vinduet vil du sikkert have mulighed for at vælge forskellige
egenskaber, heriblandt gennemsigtighed - ellers har du sikkert en
options-knap i vinduet.

--
Mvh. Kim Ludvigsen
Synkroniser dine data med Allway Sync. Programmet kan synkronisere
mellem pc og USB-nøgle eller mellem forskellige netværkssteder.
http://kimludvigsen.dk

Søg
Reklame
Statistik
Spørgsmål : 177552
Tips : 31968
Nyheder : 719565
Indlæg : 6408849
Brugere : 218887

Månedens bedste
Årets bedste
Sidste års bedste