Avatar billede mpjc Nybegynder
17. november 2005 - 19:58 Der er 21 kommentarer og
1 løsning

Hvad skal jeg gøre?

Hej!

Jeg har nu siddet og leget lidt med Firefox, HTML og CSS. Men når det vises i IE ( som nok vel de fleste bruger ) ser det ikke ens ud.

Hvilket jeg synes er mærkeligt, da jeg har angivet det i procent og íkke pixels. ( ved godt at IE ikke understøtter CSS fuldt ud men alligevel ). Den må da kunne læse procent.

Hvad kan det skyldes?

---

http://users.mpjc.dk/docs/firefox.jpg
http://users.mpjc.dk/docs/IE.jpg
Avatar billede mpjc Nybegynder
17. november 2005 - 19:59 #1
Avatar billede trekkies Juniormester
17. november 2005 - 21:07 #2
Det er svært at hvad du har lavet forkert, da man skal se noget kode først.

Men du kan da prøve følgende sider.
Valider din css filer:
http://jigsaw.w3.org/css-validator/

Valider din html filer:
http://validator.w3.org/

Hvis jeg skal hjælpe mere, skal jeg se noget kode.
Avatar billede mpjc Nybegynder
18. november 2005 - 07:38 #3
Hej!

Ok... Men vi er enige om at man kan se forskel ikke... Har fundet ud af noget andet mystisk, hvis man køre siden i en højere opløsning end 1024 x 768 ser det heller ikke ens ud... Må sige jeg fatter det ikke når jeg har angivet det i procent.

Uploader koden senere idag, har den ikke ved mig i øjeblikket.
Avatar billede johan.o Nybegynder
18. november 2005 - 12:05 #4
Hm, det ligner unægteligt problemer med din <!DOCTYPE>, men svært at sige uden kode :)

Mvh. Johan
Avatar billede mpjc Nybegynder
18. november 2005 - 14:39 #5
Hej!

Her er koden til html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>mpjc.dk |</title>
<link rel="shortcut icon" href="/img/grafik/favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="/secure/themes/secure.css" type="text/css">
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
  if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>
<body onLoad="MM_preloadImages('img/grafik/Logo_act.gif')">
<div id="top"><a href="/secure" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Logo','','img/grafik/Logo_act.gif',1)"><img src="img/grafik/Logo_dea.gif" name="Logo" width="300" height="90" border="0"></a></div>
<div class="style1" id="menu"><strong>Forside + Support + Download + Sikkerhed + Nyheder + Grafik + Anmeldelser + Kontakt </strong></div>
<div class="style1" id="main">
  <div id="left" class="style2">
    <p>Nyheder<br>
      <br>
    Hosting
</p>
    </div>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <div id="right">
    <p>&nbsp;</p>
  </div>
</div>
<div class="style1" id="bottom">Alle retigheder reserveret + copyright 2004-2005 + bes&oslash;g + feedback + sitemap + siden er optimeret til 1024 x 768 i Firefox 1.5 </div>
</body>
</html>

---

her er koden til css

/* body */

body {
    background-color: #FFFFFF;
    background-position: center;
}


/* div */

#top{
    width: 80%;
    height: 90px;
    margin-left: auto;
    margin-right: auto;
    background-color: #E8E8E8;
    padding: 5px;
   
}

#menu{
    width: 80%;
    height: 15px;
    margin-left: auto;
    margin-right: auto;
    background-color: #869FAC;
    padding: 5px;
}

#main{
    width: 80%;
    height: 600px;
    margin-left: auto;
    margin-right: auto;
    background-color: #869FAC;
    padding: 5px;
}

#left {
    width: 20%;
    background-color: #E8E8E8;
    position: absolute;
    top: 23%;
    padding: 5px;

}

#right {
    width: 56%;
    background-color: #E8E8E8;
    position: absolute;
    left: 32%;
    top: 23%;
    padding: 5px;
}
#bottom{
    width: 80%;
    height: 25px;
    margin-left: auto;
    margin-right: auto;
    background-color: #F3F3F3;
    padding: 5px;   
}


/* font */

.style1 {
    font-family: Georgia;
    font-size: 70%;
    color: #555555;
}
   
.style2 {
    font-family: Georgia;
    font-size: 100%;
    color: #555555;
}
/* links */

a:link {
    color: #FFFFFF;
    text-decoration: none;
}
a:visited {
    text-decoration: none;
    color: #FFFFFF;
}
a:hover {
    text-decoration: none;
    color: #6E8FA2;
    }
a:active {
    text-decoration: none;
    color: #FFFFFF;
}

/* sponsor */

/* form-felt */
   
/* billeder */

/* tabel */

/* rule */

/* runde kanter */

/* top */
Avatar billede mpjc Nybegynder
18. november 2005 - 14:40 #6
og jeg har valideret den hos w3.org

ang. html'en siger den at jeg skal skrive en specifikation til logoet...

og til css'en brokker den sig over jeg ikke har valgt nogen baggrundsfarve.
Avatar billede olebole Juniormester
18. november 2005 - 17:05 #7
<ole>

Skriv, hvad validatoren skriver, hvis du ikke kan oversætte det korrekt  :)

"ang. html'en siger den at jeg skal skrive en specifikation til logoet..." giver ingen mening. Hvad skriver validatoren præcist?

Validatoren skriver ikke, det er en fejl, du ikke angiver en baggrundsfarve - men giver dig en _advarsel_, om at dette kan være uhensigtsmæssigt ... f.eks. hvis der ikke er forskel på forgrunds- og baggrundsfarve. Det kan validatoren nemlig kun vide, hvis de begge er sat.

/mvh
</bole>
Avatar billede mpjc Nybegynder
19. november 2005 - 10:21 #8
Det med logo'et: Den siger at jeg skal indtaste en ALT beskrivelse. ( altså når musen flyttes over logo'et )

Men du kan ikke komme med en grund til at der er forskel i IE og FF.
Avatar billede trekkies Juniormester
19. november 2005 - 10:59 #9
mpjc:
Er det noget i denne stil du har tænkt dig?
IE Billed:
http://www.darkskies.dk/exp_billeder/ie9.jpg

Firefox billed:
http://www.darkskies.dk/exp_billeder/firefox6.jpg
Avatar billede mpjc Nybegynder
19. november 2005 - 12:04 #10
Hej!

Nej, jeg havde mere tænkt mig så der var lidt mellemrum. Imellem de to "rammer". Ligesom hvis man ser den i Firefox, sådan skal den også være i IE.
Avatar billede trekkies Juniormester
19. november 2005 - 12:16 #11
Avatar billede mpjc Nybegynder
19. november 2005 - 13:16 #12
Ja, det hjælper på det.

Vil bare godt have at denne #right {
    width: 56%;
    background-color: #E8E8E8;
    position: absolute;
    left: 32%;
    top: 23%;
    padding: 5px;
}

gik helt ud til højre og ikke sluttede sådan, midt i det hele.

Noget lign. dette http://user.mpjc.dk/docs/for.gif
Avatar billede trekkies Juniormester
19. november 2005 - 13:38 #13
Avatar billede mpjc Nybegynder
19. november 2005 - 13:45 #14
Jep... ligesom i firefox-1.jpg da der er lidt blå ramme tilbage og det er det jeg ønsker.

Men kan du også få den til det i IE?
Avatar billede trekkies Juniormester
19. november 2005 - 14:54 #15
Prøv at se disse links:
Firefox:
http://www.darkskies.dk/exp_billeder/firefox-3.jpg

IE:
http://www.darkskies.dk/exp_billeder/ie-3.jpg

Hvis man kigger efter, så er der større mellemrum mellem left og right i IE end i Firefox, man kan også se at der er større mellemrum mellem right og slut i Firefox end i IE, jeg har prøvet at fjerne det, men det er lidt svært, men vil prøve lidt i nu.
Avatar billede olebole Juniormester
19. november 2005 - 14:58 #16
Prøv at smide et link til siden - så vi ved, hvor vi er henne med koden. Billeder er ikke noget værd i den sammenhæng  :)
Avatar billede trekkies Juniormester
19. november 2005 - 15:04 #17
Avatar billede mpjc Nybegynder
19. november 2005 - 15:12 #18
Trekkies: Ja, det er sådan det skal se ud.

Ole: Hvad mener du?
Avatar billede trekkies Juniormester
19. november 2005 - 15:21 #19
Her er koden til CSS filen:

/* body */

body {
    background-color: #FFFFFF;
    background-position: center;
    color: #869FAC;
    margin-right: 40px;
    margin-left: 70px;
}


/* div */

#top{
    width: 800px;
    height: 90px;
    margin-left: auto;
    margin-right: auto;
    background-color: #E8E8E8;
    padding: 5px;
    color: #ffffff;   
}

#menu{
    width: 800px;
    height: 15px;
    margin-left: auto;
    margin-right: auto;
    background-color: #869FAC;
    padding: 5px;
    color: #555555;
}

#main{
    width: 800px;
    height: 600px;
    margin-left: auto;
    margin-right: auto;
    background-color: #869FAC;
    padding: 5px;
    color: #ffffff;
}

#left
{
    width: 150px;
    float:left;
}

#right
{
    width: 630px;
    float:right;
}
#bottom{
    width: 800px;
    height: 25px;
    margin-left: auto;
    margin-right: auto;
    background-color: #F3F3F3;
    color: #555555;
    padding: 5px; 
}


/* font */

.style1 {
    font-family: Verdana, sans-serif;
    font-size: 70%;
    color: #555555;
    background-color: #ffffff;
}
 
.style2 {
    font-family: Verdana, sans-serif;
    font-size: 100%;
    color: #555555;
    background-color: #ffffff;
}
/* links */

a:link {
    color: #FFFFFF;
    text-decoration: none;
    background-color: #000000;
}
a:visited {
    text-decoration: none;
    color: #FFFFFF;
    background-color: #000000;
}
a:hover {
    text-decoration: none;
    color: #6E8FA2;
    background-color: #FFFFFF;
    }
a:active {
    text-decoration: none;
    color: #FFFFFF;
    background-color: #000000;
}

/* sponsor */

/* form-felt */
 
/* billeder */

/* tabel */

/* rule */

/* runde kanter */

/* top */


Jeg har ikke ændret i din HTML fil, ud over at jeg har sat alt="" ind i din img kode.

Du kan prøve at validere din HTML og CSS fil, koden i den CSS tekst som jeg har skrevet er valideret.
Avatar billede mpjc Nybegynder
19. november 2005 - 16:12 #20
Jeg siger tak for hjælpen.

Så mangler jeg bare at give nogle point.
Avatar billede trekkies Juniormester
19. november 2005 - 16:14 #21
Glad for at kunne hjælpe dig :)
Avatar billede trekkies Juniormester
19. november 2005 - 17:08 #22
Tak for point :)
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