Avatar billede m-koldsgaard Nybegynder
13. september 2002 - 12:53 Der er 26 kommentarer og
1 løsning

Mozilla, HTML = Perfekt, XHTML = Not Perfekt

Hej

Jeg har været ved at lave et nyt design til min hjemmeside. Det blev lavet i HTML, og virker perfekt i både Mozilla og IE (Jeg hader alle de andre browsere. Mozilla er den bedste alternative browsere lige efter IE!). Men så kom jeg jo på den åndssvage idé at lave til om det XHTML. Det virker også godt nok i IE, men i Mozilla er der to ting der virker knap så godt:
  Height i en table
  Et JavaScript


Min nuværende website kan ses på www.koldsgaard.tk, hvor Javascriptet der gør teksten 'KOLDSGAARD' større, både virker i Mozilla og IE.

Det nye site kan ses på www.koldsgaard.ath.cx (men er kun tilgængelig, når jeg er online, men jeg har ADSL, så den skal nok være tilgængelig mange timer i døgnet.)
Prøv at åbne den i Mozilla og i IE, så kan I se hvad jeg mener med height i table...


Hvis der ikke er nogen løsning, bliver jeg nød til at ændre sitet tilbage til HTML igen, og det vil jeg helst være fri for...
Avatar billede m-koldsgaard Nybegynder
13. september 2002 - 12:54 #1
Hov adressen til det nye site er:
www.koldsgaard.ath.cx/sitet.asp
13. september 2002 - 13:08 #2
http://www.ildstorm.dk/ex/ikke_artikel/height_mozilla.html fra et andet spm.

Men hvorfor gøre brug af tabeller?
Det kunne også laves med <div> tags og postions. Eller <div> tags og så noget float.

Sig til hvis der skal uddybes, kan også godt lave et lille eksempel til i aften.

/Casper
Avatar billede m-koldsgaard Nybegynder
13. september 2002 - 13:27 #3
Jeg havde slet ikke tænkt på div positions... det er taget til overvejelse...

Det der 'float' må du godt forklare, hvad kan bruges til.


Jeg har lige lavet et eksempel, med mit problem:
www.koldsgaard.ath.cx/Test-HTML.html
www.koldsgaard.ath.cx/Test-XHTML.html
(Bemærk koden til tablen er fuldstændig ens)
Avatar billede paviuz Nybegynder
13. september 2002 - 14:39 #4
er det der der med <div style="float:left;"></div> og float:right;
13. september 2002 - 15:13 #5
Hmm...
<div style="width: 100%; height: 75%; background-color: gray;">
Tom           
</div>
<div style="width: 100%; height: 25%; background-color: red;">
Bund
</div>

Prøv at teste den under HTML 4.0 i Mozilla, den virker så under XHTML 1.0 den virker ikke.
Avatar billede m-koldsgaard Nybegynder
13. september 2002 - 16:11 #6
Avatar billede m-koldsgaard Nybegynder
14. september 2002 - 00:54 #7
Okay, jeg vil seng nu, så mit nye design-site er nede indtil engang i morgen.
Avatar billede m-koldsgaard Nybegynder
14. september 2002 - 13:12 #8
Nu har det nye design-site været oppe et stykke tid i dag...
Men jeg har stadigvæk ikke fået svar på mine spm... :(
Avatar billede osaka_san Nybegynder
14. september 2002 - 13:31 #9
Først og fremmeste kunne det være en ide at validere sitet op imod w3c's XHTML validator. Når du nu alligevel har valgt at følge en bestemt specifikation.

Dernæst kunne det hjælpe at du putter noget indhold ind i dine tomme tabelceller hvis Moz skal reagere på dem. f.eks et &nbsp;
Det løser så ikke problemet med table height 100% men det burde i det mindste få din top grå bar til at fylde lidt mere end den gør nu.

Sidst men ikke mindst burde dette her kunne hjælpe dig lidt på vej;

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>
<head>
<title>Page title</title>
<style type="text/css">
<!--
body{height:100%;margin:0px;}
html{height: 100%;margin:0px;}
table{height:100%; background:#ccc;}
-->
</style>

</head>
<body>


<table summary="">
<tr><td>asdasd</td></tr>
</table>

</body>

Situationen er den at når du via css sætter height til 100%, eller en anden procent sats så bliver det til en værdi der tages ud fra dens parent. Eftersom tabellens parent er body og dernæst igen html elementet, er et vigtigt at sætte disse til 100% af hele viewportens størrelse.

<html> tagget fotæller browseren hvor dit dokument starter og hvor det slutter, så rent teknisk er dette din yderste grænse på dit dokument.

Det ovenforstående er test i mozilla 1,1 og IE 6. Har ikke lige tjekket igennem andre, men teoretisk bure det virker, men teori er desværre aldrig helt sammenhængende med virkeligheden ;-)

Mvh
Oscar Eg Gensmann
www.gensman.com
Avatar billede m-koldsgaard Nybegynder
14. september 2002 - 16:34 #10
Tak Oscar Eg Gensmann...
Nu er mit table height problem løst.

Men kan du give en forklaring på hvorfor det virker i HTML og ikke i XHTML?
Det eneste i filen der ikke at valid er <body scroll="no">, og det er fordi jeg ønsker at fjerne IE's scrollbar (Mozilla viser ingen scrollbar hvis det ikke er nødvendig).

Læg lige et svar så du kan få point.

Men der er først point til dig, når mit JavaScript problem er løst.


Er der nogle ved hvordan man lige fikser det?
Avatar billede m-koldsgaard Nybegynder
14. september 2002 - 16:35 #11
De 4 test sider er forresten slettet!
Avatar billede osaka_san Nybegynder
14. september 2002 - 16:57 #12
m-koldsgaard>
Hvorfor height attributten ikke tilgængelig i xhtml, men i html?

scroll="no" er ikke XHTML kode og når du angiver en doc type der fortæller at dokumentet er XHTML bør du også følge de "regler" der gælder for XHTML syntaxen, ellers skal du helelre fjerne doctype tagget eller angive en anden DTD som indeholder scroll i body.

Jeg går ud fra det javascript du mener der ikke virker er dit zoom script ?

Har du tjekket at det udelukkende benytter funktioner der er DOM compliant? - jeg er ikke javascript kyndig så jeg har svært ved at sige hvor den går galt. Dog ville et bud være at så vidt jeg husker så skal moz have enheden sendt med videre. Dvs du kan ikke sætte font-size = 12 du skal sætte den til 12px

Mvh
Oscar Eg Gensmann
www.gensmann.com
Avatar billede m-koldsgaard Nybegynder
14. september 2002 - 17:22 #13
Takker...

Nu virker det hele !

Men bare fordi jeg har en Doc Type, behøves jeg vel ikke at have en total valid side?
Men kender du evt. en anden måde at fjerne scrollbaren i IE på?
Avatar billede osaka_san Nybegynder
14. september 2002 - 17:33 #14
>Men bare fordi jeg har en Doc Type, behøves jeg vel ikke at have en total
>valid side?

Jow helst, medmindre det er små midlertidige fejl som er planlagt til at blive rettet.

Hvis det er beviste fejl svarer det til at man f.eks kalder en kylling salmonellafri selv om man ved der er en lille smule i alligevel.

Så IMHO sørger man for at følge reglerne for den dokument type man har valgt eller også vælger man en anden der passer til det man vil. Om det så er en w3c eller en helt anden er ligegyldigt, men det er ikke fair at fortælle brugeren/browseren at siden er en ting uden at være det. Samtidig risikerer du at kommende browsere ganske enkelt ikke understøtter funktioner der ikke er i den DTD der er specificeret.

Mvh
Oscar Eg Gensmann
Avatar billede m-koldsgaard Nybegynder
14. september 2002 - 17:41 #15
Jeg beholder <body scroll="no"> indtil jeg finder en anden valid løsning.
Men jeg er løbet i et andet problem, forsiden som er XHTML valid:
http://validator.w3.org/check?uri=http%3A%2F%2Fwww.koldsgaard.ath.cx%2Fforside.asp&charset=%28detect+automatically%29&doctype=%28detect+automatically%29&ss=&outline=&sp=&noatt=
Den kan jeg ikke se om er css valid:
http://jigsaw.w3.org/css-validator/validator?uri=http://www.koldsgaard.ath.cx/forside.asp
Hvad skyldes det?


Dog kan jeg godt validere min index.css:
http://jigsaw.w3.org/css-validator/validator?uri=http://www.koldsgaard.ath.cx/index.css
Er der forresten en måde man kan skjule de der scrollbar-tags for validateren?
Avatar billede osaka_san Nybegynder
14. september 2002 - 17:45 #16
formodentlig fordi validatoren nogen gange har lidt svært ved at fetche css filen direkte fra html dokumentet. Det sker til tider.

/Gensmann
Avatar billede m-koldsgaard Nybegynder
14. september 2002 - 17:48 #17
Jeg har forresten lige løst mit '<body scroll="no">'-problem løsningen er:
overflow: auto;
Avatar billede osaka_san Nybegynder
14. september 2002 - 17:50 #18
okay, det lyder rimelig fornuftigt. :)
Avatar billede m-koldsgaard Nybegynder
14. september 2002 - 17:52 #19
Jamen jeg vil jo gerne have det css som jeg har i selve filen valideret, altså de steder jeg har skrevet style="..."
Avatar billede osaka_san Nybegynder
14. september 2002 - 18:08 #20
Så vidt jeg er bekendt checker validatoren ikke på inline styles men kun på style sheets.

/Gensmann
Avatar billede osaka_san Nybegynder
14. september 2002 - 18:35 #22
Du får nok mere ud af at kigge her:

http://jigsaw.w3.org/css-validator/Email.html.en

/Gensmann
Avatar billede m-koldsgaard Nybegynder
14. september 2002 - 19:29 #23
Jeg fik løst mit problem.

Det var fordi at jeg havde noget asp øverst i dokumentet og det betød at der kom en tom linie før <?xml version="1.0" encoding="ISO-8859-1" ?> altså:

Før:
<% noget asp %>
<?xml version="1.0" encoding="ISO-8859-1" ?>
resten af dokument

dvs. et output der så sådan ud:
Linie 1:
Linie 2:<?xml version="1.0" encoding="ISO-8859-1" ?>
Linie 3,4,5 osv.: Resten af dokumentet


Nu:
<?xml version="1.0" encoding="ISO-8859-1" ?>
<% noget asp %>
resten af dokument

dvs. et output der så sådan ud:
Linie 1:<?xml version="1.0" encoding="ISO-8859-1" ?>
Linie 2:
Linie 3,4,5 osv.: Resten af dokumentet
Avatar billede osaka_san Nybegynder
14. september 2002 - 19:39 #24
ok - nydeligt
Avatar billede m-koldsgaard Nybegynder
14. september 2002 - 19:40 #25
Nu er hele mit site valid XHTML og CSS (undtagen scrollbaren til IE).
Avatar billede m-koldsgaard Nybegynder
14. september 2002 - 19:41 #26
Og så har jeg nogle warnings:
You have no background-color with your color
Same colors for color and background-color in two contexts

Men det kan jeg godt leve med...
Avatar billede m-koldsgaard Nybegynder
14. september 2002 - 21:40 #27
Nu er siden uploadet til www.koldsgaard.tk og virker som forventet
Jeg har også lige tilføjet: "Valideret XHTML 1.0" :-)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester