Få en site til å virke i forskjellige lesere

Få en site til å virke i forskjellige lesere

Innleggav srb » tor 05.06.2008 14:26

Jeg arbeider i dreamweaver, og sjekker at det jeg arbeider med fungerer i preview i safari og opera. (Det er de jeg har tilgang til).

Når jeg derimot gikk inn og brukte browsershot var det ikke bra! Ikke engang Safari ser ut til å virke der... kan evt skille mellom tiger og leopard utgjøre store ting i denne sammenhengen...?
Hvordan kan jeg arbeide i en modus som gjør arbeidet kompatibelt med leseren/leserne???
Å arbeide slik jeg gjør nå er jo som å tegne i blinde :-P
medlem i 193 måneder
 

Re: Få en site til å virke i forskjellige lesere

Innleggav TDSzevz » tor 05.06.2008 14:44

Jeg bruker å ha alle nettleserne installert og teste i de forskjellige. Etterhvert så lærer man seg også de vanligste feilene og da blir det litt mindre koding i blinde, så det er nok til dels en erfaringssak.

Er det noen konkrete problemer du ikke får løst så kan du jo poste det i forumet så finner man sikkert en løsning.

Brukerens avatar
medlem i 210 måneder
 

Re: Få en site til å virke i forskjellige lesere

Innleggav srb » tor 05.06.2008 15:07

hmmm...
det er likefult noe snodig når det ser ut til å virke i preview i de nevnte leserne, men ikke når jeg går inn på nettadr og tester. Den er forøvrig:
http://home.online.no/~pedebe/...
dette er css´en til siden:
Kode: Merk alt
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<head>
<style type="text/css" media="screen">
<!--

body{
   margin:0px;
   padding:0px;
   background-image:url(../../URL/flower.png);
   background-repeat:no-repeat;
   background-color:#000000;
}

#container{
   background-repeat:no-repeat;
   margin:0 auto;
   text-align:center;
   position:relative;
   width:800px;
   height:620px;
   background-color:#006633;
   margin-top:0px;
}


h1{
   color:#FF6600;
   font-family:Arial, Helvetica, sans-serif;
}

p{
   text-align:left;
   color:#FFFFFF;
   font-family:"Chaparral Pro";
   }
   
#header{
background-image:url(../../URL/livet-i-hagen.png);
   text-align:right;
   padding-top:0px;
   padding-right:0px;
   position:relative;
   width:800px;
   height:80px;
   margin-top:0px;
   margin-left:0px;
}

#leftsidebar{
background-image:url(../../URL/leftsidebarbg.png);
   text-align:center;
   position:relative;
   float:left;
   padding-top:5px;
   padding-right:5px;
   width:150px;
   height:500px;
   margin-right:3px;
   margin-top:3px;
   margin-bottom:1px;
}

#maincontent{
   background-image:url(../../URL/s%C3%B8t.jpg);
   text-align:center;
   position:relative;
   width:636px;
   height:499px;
   float: left;
   border: 2px solid black;
   margin-top: 3px;
   padding-top: 3px;
   padding-bottom:3px;
}

#footer{
   text-align:right;
   padding-top:3px;
   padding-right:0px;
   position:relative;
   width:800px;
   height:30px;
   background-color:#FF6600;
   margin-top:3px;
   margin-left:0px;
   clear: both;
}

#footer p{
   font-size:12px;
   }
   
ul{
   list-style-image:url(../../URL/listeelementpng.png);
   font-family:"Courier New", Courier, monospace;
   color:#333333;
   font-size:12px;
   text-align:center;
}

   

-->
</style>
</head>
<body>
<div id="container">
<div id="header"></div>
<div id="leftsidebar">
   <ul><li>blomster</li>
    <li>vanning</li>
    <li>sol</li>
    <li>jødsling</li>
</ul></div>
<div id="maincontent"></div>
<div id="footer"><p>copyright all photos srberg</p></div></div>


</body>
</html>
medlem i 193 måneder
 

Re: Få en site til å virke i forskjellige lesere

Innleggav KDN » tor 05.06.2008 16:07

Mye lettere å se hva som er tenkt og hvordan det er nå hvis man har et bilde å sammenligne med.

Moderator
Brukerens avatar
medlem i 235 måneder
 

Re: Få en site til å virke i forskjellige lesere

Innleggav taG » tor 05.06.2008 17:23

Hvorfor skiller du ikke ut css-koden til egen fil? På den måten kan du gjenbruke samme koden på alle undersidene =)

Brukerens avatar
medlem i 249 måneder
 

Re: Få en site til å virke i forskjellige lesere

Innleggav srb » fre 06.06.2008 14:34

eg bruker å ha alle nettleserne installert og teste i de forskjellige. Etterhvert så lærer man seg også de vanligste feilene og da blir det litt mindre koding i blinde, så det er nok til dels en erfaringssak.

Er det noen konkrete problemer du ikke får løst så kan du jo poste det i forumet så finner man sikkert en løsning.


skjønner, selv om det egentlig er en "mager" trøst :)
Kan du si om det er "vanlig" at header og leftsidemenu ikke er synlig i nettleseren?
Og Hva som evt er feilen da...
her er kodingen:
Kode: Merk alt
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
</head>
<style type="text/css" media="screen">
<!--

body{
   margin:0px;
   padding:0px;
   background-color:#FFFFFF;
}

#container{
   background-repeat:no-repeat;
   margin:0 auto;
   text-align:center;
   position:relative;
   width:980px;
   height:730px;
   background-color:#000000;
   margin-top:0px;
}


h1{
   color:#FF6600;
   font-family:Arial, Helvetica, sans-serif;
}

p{
   text-align:left;
   color:#FFFFFF;
   font-family:"Chaparral Pro";
   }
   
#header{
   background-image:url(../../URL/aikiheader.png);
   background-repeat:no-repeat;
   text-align:right;
   padding-top:0px;
   padding-right:0px;
   position:relative;
   width:850px;
   height:200px;
   left:-5px;
   top:-5px;
}

#leftsidebar{
   background-image:url(../../URL/mainmenu.png);
   background-repeat:no-repeat;
   top:-30px;
   text-align:center;
   position:relative;
   float:left;
   width:160px;
   height:541px;
   
}

#maincontent{
   background-image:url(maincontent.png);
   background-repeat:no-repeat;
   top:-30px;
   left:5px;
   text-align:center;
   position:relative;
   width:680px;
   height:540px;
   float: left;
   

}

#footer{
   background-image:url(footer.png);
   background-repeat:no-repeat;
   background-position:center;
   text-align:right;
   position:relative;
   width:980px;
   height:20px;
   clear: both;
   top:-190px;
}

#footer p{
   font-size:12px;
   }
   
ul{
   list-style-image:url(../../URL/listeelementpng.png);
   font-family:"Courier New", Courier, monospace;
   color:#333333;
   font-size:12px;
   text-align:center;
}

#speaker{
   background-image:url(speaker.png);
   background-repeat:no-repeat;
   position:relative;
   float:left;
   width:125px;
   height:701px;
   top:-195px;
}

   

-->
</style>
</head>
<body>
<div id="container">
<div id="header"></div>
<div id="leftsidebar"></div>
<div id="maincontent"></div>
<div id="speaker"></div>
<div id="footer"></div></div>


</body>
</html>


<body>
</body>
</html>
medlem i 193 måneder
 

Re: Få en site til å virke i forskjellige lesere

Innleggav martin » fre 06.06.2008 16:11

Når jeg ser på den siste kodedumpen din, kan jeg fortelle at det er sjelden layouten stemmer om man ikke putter inn noe innhold i elementene som skal styles.

Bruk gjerne dummytekst og dummybilder om du trenger det.

Men det er sansynligvis ikke hovedproblemet her. Stien til bildene i CSS'en stemmer for Dreamweaver og nettleserne du sjekker lokalt. Men når du legger siden ut på et webområde, blir henvisningen til bildene feil. DET er problemet her ;) Sjekk Activity Monitor i Safari, så ser du at stien til bildene er feil.

Vil forøvrig anbefale deg å bryte opp CSS'en fra HTML'en som taG påpeker. Utover dette ville jeg brukt en del tid på å gå gjennom de ulike nettstedene du har fått tips om i andre tråder. Rådene som finnes der vil hjelpe deg langt på vei.

For å fikse nettleserspesifikke feil kan du sjekke guiden på Kreativ1, som også inneholder en del ressurser.

Administrator
Brukerens avatar
medlem i 249 måneder
 


Returner til CSS



Hvem er i Forumene

Registrerte brukere: Ingen registrerte brukere