Avatar billede krel Nybegynder
13. juli 2007 - 15:48 Der er 25 kommentarer og
1 løsning

w3 standarter og firefox

Hej derude?

Jeg sidder med et lille problem med en hjemmeside.
Jeg vil self. have w3 standart på siden men efter at have tilføjet doctype gik det hele lidt i sammentræk ;-)

min side er opbigget af en tabel og højderne for de forskellige rækker ned af siden kommer her:
(1) 5px (kant)
(2) 100px (billede)
(3) 5px (kant)
(4) 20px (grafik)
(5) 20px (overskrift, titel)
(6) 100% (menu, tekst-indhold, nyheder)(i procent!)
(7) 5px (kant)
(8) 20px (firma information)
(9) 5px (kant)

Det hele ser bedst ud i IE og tilnærmelsesvis i opera, men i firefox går det helt galt.

For det første, selve tabellen (den hvide baggrund) skal gå fra top til bund, derudover bliver række 4,5 og 8 bliver meget større end 20px..
hvad kan dette skyldes?

Er der ellers noget man skal være spec. opmærksom på med w3??
- bruger: (hvis det har noget at sige)
<!doctype html public "-//w2c//dtd html 4.01 transitional//en" "http://www.w3.org/tr/html4/loose.dtd">
Avatar billede krel Nybegynder
13. juli 2007 - 15:49 #1
... os så glemte jeg lige et link:
http://www.tourdefoxdecarvalho.dk/test/FIRMA_INFO_copy(1)/index.htm

MVH
Kristian
Avatar billede gider_ikke_mere Nybegynder
13. juli 2007 - 16:15 #2
Inden du begynder på fejlfinding i IE og Firefox, skal du først og fremmest validere siden. Ellers kan hverken w3 eller firefox forstå siden korrekt.

Altså ret de fejl du får at vide.
Avatar billede krel Nybegynder
13. juli 2007 - 16:26 #3
ok 21 fejl, en masse er dog at der ikke er nogen ALT på mine billeder.
Men hvordan kan det være et det er forkert af afslutte med (>) i f.eks. bold-tag <b>tekst</b>???

kan du evt give et par preg hvis du kigger her:
http://validator.w3.org/check?uri=http%3A%2F%2Fwww.tourdefoxdecarvalho.dk%2Ftest%2FFIRMA_INFO_copy%281%29%2Findex.htm

/kristian
Avatar billede gider_ikke_mere Nybegynder
13. juli 2007 - 16:54 #4
Du må ikke have 100% højde på en table. Dit javascript forstår jeg ikke, og kan derfor ikke hjælpe der.

Men hvor er start tag for de 2?

Ellers er resten således:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-language" content="da">
<meta http-equiv="content-type" content="text/html; charset=windows-1252">
<link rel="stylesheet" type="text/css" href="../style/style.css">
<link rel="shortcut icon" href="../grafik/favcon.ico">
<link rel="icon" href="../grafik/favcon.ico">
<script type="text/javascript" language="javascript1.2">
//form tags to omit in NS6+:
var omitformtags=["input", "textarea", "select"]

omitformtags=omitformtags.join("|")

function disableselect(e){
if (omitformtags.indexOf(e.target.tagName.toLowerCase())==-1)
return false
}

function reEnable(){
return true
}

if (typeof document.onselectstart!="undefined")
document.onselectstart=new Function ("return false")
else{
document.onmousedown=disableselect
document.onmouseup=reEnable
}
</script>
<title> ¬ firma information</title>
<script type="text/javascript" language="JavaScript1.2">
<!--
var starttag="<font style='font size: 6pt; color: 000000'><b>"
klokke="ja"
ugedag="ja"
var dayarray=new Array("SØNDAG","MANDAG","TIRSDAG","ONSDAG", "TORSDAG","FREDAG","LØRDAG")
var montharray=new Array("JANUAR","FEBRUAR","MARTS","APRIL","MAJ","JUNI","JULI", "AUGUST","SEPTEMBER","OKTOBER","NOVEMBER","DECEMBER")
function getthedate(){
var mydate=new Date()
var year=mydate.getYear()
if (year < 1000)
year+=1900
var day=mydate.getDay()
var month=mydate.getMonth()
var daym=mydate.getDate()
var hours=mydate.getHours()
var minutes=mydate.getMinutes()
var seconds=mydate.getSeconds()
if (hours>24){
hours=hours-24
}
if (hours==00)
hours=00
if (minutes<=9)
minutes="0"+minutes
if (seconds<=9)
seconds="0"+seconds
cdate = starttag +daym+'. '+montharray[month]+' '+year+'</b></font>';
if (document.all)
document.all.clock.innerHTML=cdate
else if (document.getElementById)
document.getElementById("clock").innerHTML=cdate
else
document.write(cdate)
}
if (!document.all&&!document.getElementById)
getthedate()
function a_tid(){
if (document.all||document.getElementById)
setInterval("getthedate()",10)
}
</script>
</head>

<body onload="a_tid()">
<div align="center">
<table border="0" width="720" height="100%" id="table1" cellspacing="0" cellpadding="0">
    <tr>
        <td height="5" width="10"></td>
        <td height="5" width="100"></td>
        <td height="5" width="5"></td>
        <td height="5" width="595" colspan="2"></td>
        <td height="5" width="10"></td>
    </tr>
    <tr>
        <td height="100" width="10">&nbsp;</td>
        <td height="100" width="100">
        <img border="0" src="bild.png" width="100" height="100" alt=""></td>
        <td height="100" width="5">&nbsp;</td>
        <td height="100" width="595" colspan="2">
        <img border="0" src="bild.png" width="595" height="100" alt=""></td>
        <td height="100" width="10">&nbsp;</td>
    </tr>
    <tr>
        <td width="10" height="5"></td>
        <td width="100" height="5"></td>
        <td width="5" height="5"></td>
        <td width="595" height="5" colspan="2"></td>
        <td width="10" height="5"></td>
    </tr>
    <tr>
        <td width="10" height="20">&nbsp;</td>
        <td width="100" height="20" valign="top" style="background-image:url(grafik(small).png)" align="left">
        <span id="clock"></span></td>
        <td width="5" valign="top" height="20">&nbsp;</td>
        <td width="595" height="20" style="background-image:url(grafik(large).png)" colspan="2">
        <p style="margin-left: 277px; margin-top: 2px" align="left">
        <span style="font-size: 7pt">Billedinfo: motiv, sted</span></td>
        <td width="10" height="20">&nbsp;</td>
    </tr>
    <tr>
        <td width="10" height="20">&nbsp;</td>
        <td width="100" height="20">
        &nbsp;</td>
        <td width="5" height="20">&nbsp;</td>
        <td width="470" height="20">
        <p style="margin-left: 5px" align="left">
        <font size="2"><b>OVERSKRIFT</b></font> _ tekst tekst tekst</td>
        <td width="125" height="20"></td>
        <td width="10" height="20">&nbsp;</td>
    </tr>
    <tr>
        <td width="10" valign="top" height="100%">&nbsp;</td>
        <td width="100" valign="top" height="100%">
        <table border="0" width="100%" id="menu" cellspacing="0" cellpadding="0">
            <tr>
                <td height="17">
                <img border="0" src="forside.png" width="100" height="17" alt=""></td>
            </tr>
            <tr>
                <td height="17">
                <img border="0" src="forside.png" width="100" height="17" alt=""></td>
            </tr>
            <tr>
                <td height="17">
                <img border="0" src="forside.png" width="100" height="17" alt=""></td>
            </tr>
            <tr>
                <td height="17">
                <img border="0" src="forside.png" width="100" height="17" alt=""></td>
            </tr>
            <tr>
                <td height="17">
                <img border="0" src="forside.png" width="100" height="17" alt=""></td>
            </tr>
            <tr>
                <td height="17">
                <img border="0" src="forside.png" width="100" height="17" alt=""></td>
            </tr>
            <tr>
                <td height="17">
                <img border="0" src="forside.png" width="100" height="17" alt=""></td>
            </tr>
            <tr>
                <td height="17">
                <img border="0" src="forside.png" width="100" height="17" alt=""></td>
            </tr>
            <tr>
                <td height="17">
                <img border="0" src="forside.png" width="100" height="17" alt=""></td>
            </tr>
        </table>
        </td>
        <td width="5" valign="top" height="100%">&nbsp;</td>
        <td width="470" valign="top" height="100%">
        <p style="margin-left: 5px; " align="justify">
        <iframe marginwidth="1" marginheight="1" width="100%" name="indhold" style="border:none" frameborder="0" height="100%" src="tekst.htm"></iframe></td>
        <td width="125" valign="top" height="100%">
<table border="0" width="100%" id="news" cellspacing="0" cellpadding="0">
            <tr>
                <td align="left">
        <img border="0" src="news.png" width="125" height="17" alt=""></td>
            </tr>
            <tr>
                <td align="left">
        <img border="0" src="bild.png" width="125" height="125" alt=""></td>
            </tr>
            <tr>
                <td align="left"><b>TITEL</b></td>
            </tr>
            <tr>
                <td align="left">00.00.0000 _ 00:00</td>
            </tr>
            <tr>
                <td align="left"><i>tekst tekst tekst tekst tekst tekst tekst
                tekst ..</i></td>
            </tr>
            <tr>
                <td align="left">&not;&nbsp;læs mere</td>
            </tr>
            <tr>
                <td align="left">&nbsp;</td>
            </tr>
            <tr>
                <td align="left">
        <img border="0" src="news.png" width="125" height="17" alt=""></td>
            </tr>
            <tr>
                <td align="left">00.00.0000 _ 00:00</td>
            </tr>
            <tr>
                <td align="left">
        <b>TITEL</b> undertitel</td>
            </tr>
            <tr>
                <td align="left">&not;&nbsp;læs mere</td>
            </tr>
        </table>
        </td>
        <td width="10" valign="top" height="100%">&nbsp;</td>
    </tr>
    <tr>
        <td width="10" height="5"></td>
        <td width="100" height="5"></td>
        <td width="5" height="5"></td>
        <td width="595" height="5" colspan="2"></td>
        <td width="10" height="5"></td>
    </tr>
    <tr>
        <td width="10" height="20">&nbsp;</td>
        <td class="info" width="100" height="20">
        <p align="center">&copy; 2007 EEEEEEE A/S</td>
        <td width="5" height="20">&nbsp;</td>
        <td class="info" width="595" height="20" colspan="2">
        <p align="center"><b><font size="1">KØBENHAVN</font></b>
        HHHHHHHHN 00 . 0000 SSSSSS . 00 00 00 00&nbsp; &bull;&nbsp; <b>
        <font size="1">ÅRHUS</font></b> FIFFFFFF 00 . 0000 UUUUU U . 00 00 00 00&nbsp;
        •&nbsp; <b>KONTAKT</b></td>
        <td width="10" height="20">&nbsp;</td>
    </tr>
    <tr>
        <td width="10" height="5"></td>
        <td width="100" valign="top" height="5"></td>
        <td width="5" valign="top" height="5"></td>
        <td width="595" valign="top" height="5" colspan="2"></td>
        <td width="10" height="5"></td>
    </tr>
</table>
</div>
<br>
Screenshot: <a href="IE.png">IntertExplorer 7.0</a> (sådan skal det se ud
(næsten))<br>
Screenshot: <a href="FF.png">FireFox 2.0.0.4</a><br>
&nbsp;
</body>
</html>
Avatar billede krel Nybegynder
13. juli 2007 - 17:05 #5
Hold da op! Nu er det kun i mit javascript de to fejl ligger :), det var w3 standart. Du skulle vel ikke også kunne se problemet med mine tabellers rækkehøjder vel? hvilket to start tags er du sprg efter?
Avatar billede jesper-moeller Nybegynder
13. juli 2007 - 17:17 #6
Første ting der springer mig i øjnene er din angivelse af brde højde (eller mangel på samme

width="10" height="5" ?????

10 og 5 hvad ?
10 bananer bred og fem øldåser høj ??

Angiv altid enheden du ønsker brugt når den er andet en 0
width="10px" height="5px"
Avatar billede krel Nybegynder
13. juli 2007 - 17:17 #7
og læg lige et svar til point også... c",)
Avatar billede gider_ikke_mere Nybegynder
13. juli 2007 - 17:18 #8
For den her: cdate = starttag +daym+'. '+montharray[month]+' '+year+'</b></font>';
Der mangler som jeg kan se det en <b> & en <font> før det ovenfor, men kender som sagt meget lidt til JavaScript.
Avatar billede krel Nybegynder
13. juli 2007 - 17:19 #9
det er self korrekt.. må siges at være min egen fejl ved brug af FrontPage og deres tabel editorer..
Avatar billede krel Nybegynder
13. juli 2007 - 17:20 #10
--> ang. <b> og <font> står de i starten linie: 35 af scriptet, men måske der skulle rykkes lidt rundt på det..
Avatar billede gider_ikke_mere Nybegynder
13. juli 2007 - 17:35 #11
Sjovt. W3 sagde intet til de manglende px og jeg så det ikke.
Avatar billede krel Nybegynder
13. juli 2007 - 17:44 #12
har i slet ikke et bud på hvorfor de 20px bliver større i firefox end ie?? er jo faktisk også en del af spm'et..

/kristian
Avatar billede krel Nybegynder
13. juli 2007 - 17:54 #13
--> akyhne,
når nu man ikke kan bruge height="100%" hvordan tilpasser jeg så tabellen til at blive lige så høj som den kan alt efter browser størrelse.
Det skulle gerne være sådan, at toppen med billeder og overskrift smat bunden med sorte bjælker skulle være fast på siden uanset størrelse og så menu, tekst-indhold og nyheder tilpasses højen.??

et bud på det??
Avatar billede gider_ikke_mere Nybegynder
13. juli 2007 - 19:00 #14
Angående dine td'er: Jeg har ikke fejlen her, hverken i IE7, Firefox eller Opera.
Avatar billede krel Nybegynder
13. juli 2007 - 20:14 #15
hmm meget mærkeligt.. kan det have noget med opløsning at gøre?
Avatar billede mclemens Nybegynder
13. juli 2007 - 20:34 #16
Prøv med:
p {margin:0;}
Avatar billede krel Nybegynder
13. juli 2007 - 21:08 #17
jeg har både margin og padding sat til 0 i mit stylesheet..
Avatar billede mclemens Nybegynder
13. juli 2007 - 21:40 #18
Næh, det har du ikke.
http://www.tourdefoxdecarvalho.dk/test/style/style.css
... Der er ingen 0-stilling af margin på p elementer.
Avatar billede mclemens Nybegynder
13. juli 2007 - 21:42 #19
P.s.: Jeg har egentlig testet rettelsen med Firefox's firebug.
... Det er en fin lille add-on hvis du ikke har den indstalleret.
Avatar billede krel Nybegynder
13. juli 2007 - 21:45 #20
du har ret, jeg har den kun i mine bodytags.. dvs at margin og padding skal tilføjes alle tabeller, td'er og tr'er og p'er ????
Avatar billede krel Nybegynder
13. juli 2007 - 21:50 #21
..så blev den tilføjet og det hele ser pænt ud. c",)
mclemens du skulle vel ikke også have en løsning på at tabellen til at fylde hele siden i højden nu da height="100%" ikke går

???
Avatar billede mclemens Nybegynder
13. juli 2007 - 22:50 #22
Desværre ikke, har været væk fra eksperten i et (længere)
stykke tid, og leger ikke med height 100% til dagligt.

Selvom du kaster dette ind:
html, body {height:100%;}
#ydre {height:100%;} /* id på første div */
#table1 {height:100%;}

... Vil du få problemer med højden på det indvendige
tekstfelt - måske kan du prøve med nogle ovenliggende
elementer via z-index og så et spacer element i toppen
og bunden af det element der skal indeholde teksten.

Du vil dog kunne løbe ind i problemer med scrolleren
som er på tekst elementet, da det vil køre fra top til
bund - eventuelt kan du vælge at det ikke skal dækkes
til af top og bundstykket, men det afhænger af designet.

Det er selvfølgelig også muligt at scripte højden
ind på selve elementet via javascript i stedet.

Det er muligt at der ligger noget der kan bruges i dit tilfælde på
eksperten i forvejen - en del af mit height 100% kludder findes med.
height 100% mclemens på google
Avatar billede krel Nybegynder
14. juli 2007 - 11:42 #23
smider lige et svar mclemens så kan i dele point.. da i ligesom tog hver jeres halvdel af spm?

krel
Avatar billede krel Nybegynder
14. juli 2007 - 15:39 #24
når lukker! link fjernes.
Avatar billede mclemens Nybegynder
14. juli 2007 - 23:39 #25
Undskyld manglende reaktion, var på
arbejde 8:00 - 23:37 uden pc, men jeg
fik point i den anden tråd og det p
margin var blot en mindre detalje ;)
Avatar billede gider_ikke_mere Nybegynder
15. juli 2007 - 01:15 #26
Ellers siger du til, mclemens.
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