Avatar billede manse999 Nybegynder
25. oktober 2005 - 12:24 Der er 19 kommentarer og
2 løsninger

Min side i firefox

Hej med jer.
Min side www.nyhedsoverblikket.dk ser noget mærkelig ud i firefox, hvilket jeg er ked af, og naturligvis gerne vil have rettet.
Men jeg har ikke rigtigt nogen ide om hvad jeg kan gøre anderledes for at få siden til at se bedre ud i firefox.
Er der nogen der har nogle konstruktive ideer?
Avatar billede langthjem Nybegynder
25. oktober 2005 - 12:36 #1
Det er faktisk enkelt. Du angiver DOCTYPE (Indsæt som første linie i dit HTML dokument) som f.eks. denne som passer til "HTML 4.01 Transitional".

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Og så tilpasser du ellers al kode til at stemme overens med W3C standarderne for HTML 4.01 (Eller XHTML) og CSS2, du finder dem på www.w3c.org, så vil jeg love dig at din side også kan ses i Firefox, Opera osv. Men hvis man "slam-koder" kan det være svært at komme på rette spor. God fornøjelse.
Avatar billede keysersoze Ekspert
25. oktober 2005 - 12:37 #2
en rigtig god ting ville være hvis siden kunne valideres; http://validator.w3.org/check?uri=http%3A%2F%2Fwww.nyhedsoverblikket.dk%2F

En validering er et lille skridt på vejen - resten er stort set kun at prøve sig frem.
Avatar billede langthjem Nybegynder
25. oktober 2005 - 12:42 #3
Rigtigt nok, men jeg regnede med at han fandt ud af det når han surfede rundt på W3C.org, men et godt tip, dog ikke altid nødvendigt for et godt resultat. Valideringen er 30% funktionalitet, og 70% selvtilfredshed med en god kode ;-)
Avatar billede langthjem Nybegynder
25. oktober 2005 - 12:44 #4
Kiggede lige lidt nærmere på din side. Når nu det er en side med nyheder, hvorfor benytter du så ikke sidernes RSS-feeds? Mange af de sider du linker til har også RSS, så det er da oplagt.

Tip: Firefox viser et orange ikon nederst til højre som linker til sidens RSS hvis der bliver fundet et.
Avatar billede keysersoze Ekspert
25. oktober 2005 - 12:54 #5
som du formentlig kan se på tidspunkterne er min kommentar skrevet uden at din var der - så derfor var der ingen kommentar til dit svar. og som jeg også skrev var valideringen kun et lille skridt på vejen.
Avatar billede langthjem Nybegynder
25. oktober 2005 - 13:05 #6
Der var såmænd ingenting ivejen med din kommentar, det var jo noget jeg selv burde have set. Det er jo derfor man skriver i et forum, så får man flere sider af sagerne.
Avatar billede manse999 Nybegynder
25. oktober 2005 - 13:17 #7
Jeg er desværre ikke helt med. Kan du forklare lidt nærmere. Evt. give et eksempel.
Avatar billede manse999 Nybegynder
25. oktober 2005 - 13:20 #8
Jeg er ikke helt med. Jeg benytter da sidernes RSS feeds. Jeg sætter dem blot på en hjemmeside, så "almindelige brugere" kan se dem.
Avatar billede langthjem Nybegynder
25. oktober 2005 - 13:25 #9
Har kigget igen. Det er fordi det naturlige valg for f.eks. at læse nyhederne fra "Ekstra Bladet", er at trykke på teksten "Ekstra Bladet", regnede ikke med at der ville være forskel på knappen til venstre for teksten, og så teksten (håber du forstår). Du skulle måske skille det ad, sådan at knap og titel linker til RSS, og så et link ved siden af i stil med "Besøg siden".
Avatar billede manse999 Nybegynder
25. oktober 2005 - 14:10 #10
Hej igen.
Tak for dit svar.
Det er du faktisk ikke den første der siger, så det tror jeg jeg vil lave.
Men stadig har jeg ikke forstået hvad du mener med
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
kan du give et eksempel?
Avatar billede langthjem Nybegynder
25. oktober 2005 - 14:23 #11
Firefox overholder standarden i forvejen, men Internet Explorer har sin egen måde at vise HTML på, hvilket er udemærket for amatørerne, da man så kan omgå nogle regler. DOCTYPE tvinger Internet Explorer til at overholde standarderne, bl.a. i henhold til positionering, boks-størrelser og tekst størrelser. Det gør at koden ser ens ud i alle browsere. Skidesmart!
Avatar billede keysersoze Ekspert
25. oktober 2005 - 14:30 #12
"Det gør at koden ser ens ud i alle browsere."... hmm - så er der da et eller andet galt med mine browsere :)
Avatar billede manse999 Nybegynder
25. oktober 2005 - 14:47 #13
Hej igen.
Det kan godt være at mit spm lyder dumt, men indrømmet... jeg er ikke den vilde kode karl.
På min side includer jeg en fil som henter nyhederne, og det er i denne fil det går galt.
Kan du ud fra koden sige hvad der skal ændres for at siden ser normal ud i firefox?
Koden ser således ud:

<?php
    function listCategories()
    {    $data='';
        $handle = opendir('newsfeeds/categories');
        while($dirfile = readdir($handle)) {
            if (is_file('newsfeeds/categories/'.$dirfile) && substr($dirfile,strlen($dirfile)-4,strlen($dirfile))=='opml' ) {
                $categf=substr($dirfile,0,strlen($dirfile)-5);
                if(isset($_GET['zfcategory']) && $categf==$_GET['zfcategory']) echo "<a href=\"".$_SERVER['PHP_SELF']."?zfcategory=$categf\"><span class=\"style1\">$categf</span></a><br>";
                else echo "<a href=\"".$_SERVER['PHP_SELF']."?zfcategory=$categf\">$categf</a><br>";
            }
        }
        closedir($handle);
        return $data;
    }
?>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Nyhedsoverblikket.dk - Nyheder</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="newsfeeds/templates/css/infojunkie.css" type="text/css">
<style type="text/css">
a:link {color: blue; text-decoration:none; font-family:Geneva, Arial, Helvetica, sans-serif}
a:visited {color: #5F5FB8; text-decoration:none; font-family:Geneva, Arial, Helvetica, sans-serif}
a:hover {color: #EE7A06; text-decoration:underline; font-family:Geneva, Arial, Helvetica, sans-serif}
a:active {color:#EE7A06; text-decoration:none; font-family:Geneva, Arial, Helvetica, sans-serif}
.style1 {
    color:#336699;
    font-family: Geneva, Arial, Helvetica, sans-serif;
    font-weight: bold;
}
</style>
</head>

<body>
<table width="100%"  border="0" cellspacing="10">
  <tr align="center">
    <td colspan="2" class="style1">
    Nyhedsoverblikket - Her fÃ¥r du dine nyheder.</td>
  </tr>
  <tr>
    <td width="100%" align="left" valign="top">
    <?php
        $_GET['zftemplate']='infojunkie1';
        include('newsfeeds/zfeeder.php');
    ?>
    </td>
  </tr>
  <tr>
    <td colspan="2">&nbsp;</td>
  </tr>
</table>
</body>
<?php
    echo "<script language=\"javascript\">";
    echo "SwitchChannel({$_GET['zfmore']});";
    echo "</script>";
?>
</html>
Avatar billede manse999 Nybegynder
25. oktober 2005 - 14:57 #14
Hvis det har noget at gøre med min css fil ser den således ud:

*    zFeeder style sheet
    works with the infojunkie theme
    author: LCX
*/


.fold, .logo {
    float: left;
    margin: 0px;
    padding: 1px;
    margin-right: 5px;
    vertical-align: middle;
}

.channel {
    vertical-align: middle;
    padding: 1px;
    background-color: transparent;
    height: 16px;
    border: 1px solid Green;
    color: Black;
}

.channel img {
    max-height: 16px;
    width: auto;
    height: auto;
}

.feed {
    margin-bottom: 1px;
}

.feed a:link  {
    color: Black;
    font-family: Verdana;
    text-decoration: none;
}

.feed a:visited  {
    color: Navy;
    text-decoration: none;
}



.feed a:hover {
    text-decoration: none;
    color: #65CD76;
    font-family: Verdana;
}



.feed a:active  {
    color: #606060;
    text-decoration: none;
    font-size: 100%;
}


.newstitle {
    background-color: transparent;
    margin-top: 1px;
    margin-bottom: 1px;
    margin-left: 10px;
    padding-left: 5px;
    margin-right: 3px;
    font-family: Verdana;
    font-weight: bold;
    border-left: 1px dotted #333;
    border-top: 1px dotted #333;
    border-color: #483D8B;
}

.newsdesc {
    padding-right: 25px;
    text-align: justify;
    margin-bottom: 5px;
    margin-left: 10px;
    padding-left: 25px;
    padding-bottom: 0px;
    background-color: #000033;
    font-size: 12px;
    font-family: Verdana;
    color: Black;
    border-left: 1px dotted #333;
}

.newsdesc a:hover{
    text-decoration: underline;
}

.chanlink{
    font-family: Tahoma, Arial, Helvetica, MS sans serif;
    /*font-weight: bold;*/
    margin-left: 0px;
}

/*
.chanlink a {
    font-size: 100%;
    font-weight: bold;
}
*/

.controls {
    vertical-align: middle;
    float: right;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: 5px;
    height: 12px;
    width: auto;
}

.dateline {
    color: #999;
    font-size: 80%;
    font-family: Tahoma;
    text-align: right;
}


/* Open/Close style */

.newslist {
    display: none;
    padding-bottom: 3px;
}
Avatar billede manse999 Nybegynder
26. oktober 2005 - 09:28 #15
Langthjem. Du må gerne få mine point, men har du et svar til ovenstående?
Avatar billede keysersoze Ekspert
26. oktober 2005 - 09:39 #16
umiddelbart ser det ud som om det er din zfeeder.php den er galt med i en kombination med din css. jeg vil gætte på det er fordi IE ser en DIV som et element med 100% i bredden hvorimod FF ser samme element som værende lige så bred som indholdet gør det til.

Så alt der formentlig skal til er en <br>
Avatar billede langthjem Nybegynder
26. oktober 2005 - 10:01 #17
Du skal lave om på din CSS. Når din DOCTYPE er angivet sker der noget med dine højder og bredder. For bredde og højde gælder at margin, padding og border lægges til. Så alle steder hvor width eller height er angivet skal du trække margin, padding og border fra.
Avatar billede manse999 Nybegynder
26. oktober 2005 - 10:52 #18
Hej igen.
Kan desværre stadig ikke forstå det. Nu har jeg givet point.. 20 til langthjem og 10 til keyser.
Hvis een af jer har mod på det, må i gerne komme med et eksempel på hvor css skal rettes. Jeg smider naturligvis gerne flere point efter jer, eller alternativt en flaske rødvin til jeres adresse.
Hvis ikke i magter mere må vi slutte her, og håbe på at 99,9 % ser siden i IE, eller vente til jeg bliver bedre til kodning.
Avatar billede langthjem Nybegynder
26. oktober 2005 - 12:48 #19
Nuværende:
.channel {
    vertical-align: middle;
    padding: 1px;
    background-color: transparent;
    height: 16px;
    border: 1px solid Green;
    color: Black;
}

Bør rettes til:
.channel {
    vertical-align: middle;
    padding: 1px; /*Her har du 1px ekstra hele vejen rundt, altså 2px i højden og 2px i bredden */
    background-color: transparent;
    height: 12px; /*Her skal du trække padding og border fra hvis du vil have samme højde som nu*/
    border: 1px solid Green;
    color: Black;
}
Avatar billede langthjem Nybegynder
26. oktober 2005 - 12:52 #20
Max-height og max-width fungerer ikke i IE. Jeg vil anbefale dig at prøve TopStyle fra Bradsoft til din CSS. Du finder den på www.bradsoft.com.
Avatar billede manse999 Nybegynder
26. oktober 2005 - 15:02 #21
Jeg har rodet lidt med CSS´en og har fået det til at se nogenlunde ud.
CSS er nu således ud:
.channel {
    vertical-align: middle;
    padding: 1px;
    background-color: transparent;
    height: 30px;
    border: 1px solid Green;
    color: Black;
}

.channel img {
    vertical-align: middle;
    width: 70;
    height: 26;
    padding: 1px;
}

Nu ser det fint ud i FF oxo.
Endnu en gang 1000 tak for hjælpen.

PS: Bruger i øvrigt topstyle lite incl min ringe css viden :-)
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