1. Diese Seite verwendet Cookies. Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies. Weitere Informationen

Problem mit IE und Firefox

Dieses Thema im Forum "Web-Programmierung" wurde erstellt von Der_Leo, 14.02.08.

  1. Der_Leo

    Der_Leo Fießers Erstling

    Dabei seit:
    15.01.08
    Beiträge:
    126
    Hallo alle zusammen,

    habe inzw. die Website für die ortsansässige FDP fertig, allerdings werden Ebenen bei Opera/Safari an der richtigen Stelle, beim IE und bei Firefox versetzt angezeigt, sodass am Ende das Layout nicht mehr hinhaut.

    Wäre für eine Lösung sehr dankbar.

    Code:
    <!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=ISO-8859-1" />
    <title>Unbenanntes Dokument</title>
    <style type="text/css">
    <!--
    body,td,th {
    	color: #000000;
    	font-family: Arial, Helvetica, sans-serif;
    }
    body {
    	background-image: url(FDP_Website_Kandidaten.jpg);
    	background-repeat: no-repeat;
    }
    a:link {
    	color: #000000;
    	text-decoration: none;
    }
    a:visited {
    	text-decoration: none;
    	color: #000000;
    }
    a:hover {
    	text-decoration: underline;
    	color: #000000;
    }
    a:active {
    	text-decoration: none;
    	color: #000000;
    }
    #Layer1 {
    	position:absolute;
    	width:687px;
    	height:482px;
    	z-index:1;
    	left: 163px;
    	top: 166px;
    }
    #Layer2 {
    	position:absolute;
    	width:77px;
    	height:17px;
    	z-index:2;
    	left: 418px;
    	top: 102px;
    }
    #Layer3 {
    	position:absolute;
    	width:94px;
    	height:16px;
    	z-index:3;
    	left: 157px;
    	top: 440px;
    }
    #Layer4 {
    	position:absolute;
    	width:71px;
    	height:17px;
    	z-index:4;
    	left: 432px;
    	top: 199px;
    }
    #Layer5 {
    	position:absolute;
    	width:56px;
    	height:16px;
    	z-index:5;
    	left: 215px;
    	top: 517px;
    }
    #Layer6 {
    	position:absolute;
    	width:63px;
    	height:16px;
    	z-index:6;
    	left: 120px;
    	top: 439px;
    }
    #Layer7 {
    	position:absolute;
    	width:93px;
    	height:17px;
    	z-index:7;
    	left: 149px;
    	top: 419px;
    }
    #Layer8 {
    	position:absolute;
    	width:74px;
    	height:16px;
    	z-index:2;
    	left: 37px;
    	top: 183px;
    }
    #Layer9 {
    	position:absolute;
    	width:94px;
    	height:16px;
    	z-index:3;
    	left: 39px;
    	top: 213px;
    }
    #Layer10 {
    	position:absolute;
    	width:43px;
    	height:16px;
    	z-index:4;
    	left: 39px;
    	top: 243px;
    }
    #Layer11 {
    	position:absolute;
    	width:71px;
    	height:16px;
    	z-index:5;
    	left: 37px;
    	top: 273px;
    }
    #Layer12 {
    	position:absolute;
    	width:59px;
    	height:15px;
    	z-index:6;
    	left: 39px;
    	top: 303px;
    }
    #Layer13 {
    	position:absolute;
    	width:64px;
    	height:15px;
    	z-index:7;
    	left: 37px;
    	top: 333px;
    }
    #Layer14 {
    	position:absolute;
    	width:90px;
    	height:18px;
    	z-index:8;
    	left: 37px;
    	top: 361px;
    }
    #Layer15 {
    	position:absolute;
    	width:132px;
    	height:33px;
    	z-index:9;
    	left: 207px;
    	top: 253px;
    }
    .Stil2 {
    	font-size: 14px;
    	font-weight: bold;
    	font-family: Arial, Helvetica, sans-serif;
    }
    .Stil4 {font-family: Arial, Helvetica, sans-serif; font-size: 12px;}
    #Layer16 {
    	position:absolute;
    	width:199px;
    	height:35px;
    	z-index:10;
    	left: 207px;
    	top: 294px;
    }
    #Layer17 {
    	position:absolute;
    	width:195px;
    	height:34px;
    	z-index:11;
    	left: 207px;
    	top: 336px;
    }
    #Layer18 {
    	position:absolute;
    	width:185px;
    	height:34px;
    	z-index:12;
    	left: 207px;
    	top: 380px;
    }
    #Layer19 {
    	position:absolute;
    	width:170px;
    	height:33px;
    	z-index:13;
    	left: 207px;
    	top: 424px;
    }
    #Layer20 {
    	position:absolute;
    	width:191px;
    	height:30px;
    	z-index:14;
    	left: 207px;
    	top: 467px;
    }
    #Layer21 {
    	position:absolute;
    	width:182px;
    	height:34px;
    	z-index:15;
    	left: 207px;
    	top: 510px;
    }
    #Layer22 {
    	position:absolute;
    	width:198px;
    	height:35px;
    	z-index:16;
    	left: 207px;
    	top: 553px;
    }
    #Layer23 {
    	position:absolute;
    	width:214px;
    	height:36px;
    	z-index:17;
    	left: 207px;
    	top: 598px;
    }
    #Layer24 {
    	position:absolute;
    	width:138px;
    	height:35px;
    	z-index:18;
    	left: 547px;
    	top: 252px;
    }
    #Layer25 {
    	position:absolute;
    	width:190px;
    	height:35px;
    	z-index:19;
    	left: 547px;
    	top: 292px;
    }
    #Layer26 {
    	position:absolute;
    	width:173px;
    	height:35px;
    	z-index:20;
    	left: 547px;
    	top: 336px;
    }
    #Layer27 {
    	position:absolute;
    	width:200px;
    	height:35px;
    	z-index:21;
    	left: 547px;
    	top: 294px;
    }
    #Layer28 {
    	position:absolute;
    	width:197px;
    	height:35px;
    	z-index:22;
    	left: 547px;
    	top: 379px;
    }
    #Layer29 {
    	position:absolute;
    	width:144px;
    	height:36px;
    	z-index:23;
    	left: 547px;
    	top: 423px;
    }
    #Layer30 {
    	position:absolute;
    	width:200px;
    	height:35px;
    	z-index:24;
    	left: 547px;
    	top: 465px;
    }
    #Layer31 {
    	position:absolute;
    	width:103px;
    	height:35px;
    	z-index:25;
    	left: 547px;
    	top: 509px;
    }
    #Layer32 {
    	position:absolute;
    	width:172px;
    	height:35px;
    	z-index:26;
    	left: 547px;
    	top: 553px;
    }
    #Layer33 {
    	position:absolute;
    	width:134px;
    	height:35px;
    	z-index:27;
    	left: 547px;
    	top: 598px;
    }
    #Layer34 {
    	position:absolute;
    	width:131px;
    	height:38px;
    	z-index:27;
    	left: 549px;
    	top: 600px;
    }
    #Layer35 {
    	position:absolute;
    	width:599px;
    	height:51px;
    	z-index:28;
    	left: 163px;
    	top: 183px;
    }
    #Layer36 {
    	position:absolute;
    	width:202px;
    	height:17px;
    	z-index:29;
    	left: 664px;
    	top: 155px;
    }
    #Layer37 {
    	position:absolute;
    	width:195px;
    	height:58px;
    	z-index:29;
    	left: 382px;
    	top: 638px;
    }
    #Layer38 {
    	position:absolute;
    	width:35px;
    	height:34px;
    	z-index:30;
    	left: 164px;
    	top: 253px;
    }
    
    -->
    </style>
    <script 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('Buttons/Startseite_rollover.jpg','Buttons/Kandidaten_rollover.jpg','Buttons/Ziele_rollover.jpg','Buttons/Termine_rollover.jpg','Buttons/Presse_rollover.jpg','Buttons/Kontakt_rollover.jpg','Buttons/Impressum_rollover.jpg')">
    <a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Startseite','','Buttons/Startseite_rollover.jpg',1)"></a>
    <div id="Layer8"><a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Startseite','','Buttons/Startseite_rollover.jpg',1)"><img src="Buttons/Startseite.jpg" name="Startseite" width="72" height="14" border="0" id="Startseite" /></a></div>
    <div id="Layer9"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Kandidaten','','Buttons/Kandidaten_rollover.jpg',1)"><img src="Buttons/Kandidaten.jpg" name="Kandidaten" width="89" height="14" border="0" id="Kandidaten" /></a></div>
    <div id="Layer10"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Ziele','','Buttons/Ziele_rollover.jpg',1)"><img src="Buttons/Ziele.jpg" name="Ziele" width="37" height="14" border="0" id="Ziele" /></a></div>
    <div id="Layer11"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Termine','','Buttons/Termine_rollover.jpg',1)"><img src="Buttons/Termine.jpg" name="Termine" width="66" height="14" border="0" id="Termine" /></a></div>
    <div id="Layer12"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Presse','','Buttons/Presse_rollover.jpg',1)"><img src="Buttons/Presse.jpg" name="Presse" width="55" height="14" border="0" id="Presse" /></a></div>
    <p>&nbsp;</p>
    <div id="Layer13"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Kontakt','','Buttons/Kontakt_rollover.jpg',1)"><img src="Buttons/Kontakt.jpg" name="Kontakt" width="60" height="14" border="0" id="Kontakt" /></a></div>
    <div id="Layer14"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Impressum','','Buttons/Impressum_rollover.jpg',1)"><img src="Buttons/Impressum.jpg" name="Impressum" width="87" height="17" border="0" id="Impressum" /></a></div>
    <div id="Layer15"><span class="Stil2"><a href="gertsorgatz.html">Gert Sorgatz </a></span><span class="Stil4">Betriebsleiter, Greding </span></div>
    <div id="Layer16"><span class="Stil2"><a href="maxnetter.html">Max Netter</a></span> <span class="Stil4">Bauunternehmer, Kreisrat, Oberm&auml;ssing, Greding</span>  </div>
    <div id="Layer17"><span class="Stil2"><a href="http://www.marina-schuster.de/">Marina Schuster</a></span> <span class="Stil4">MdB, Dipl.-Kffr. Univ., Kreisr&auml;tin, Greding </span></div>
    <div id="Layer18"><span class="Stil2">Franz Haas jun.</span> <span class="Stil4">Hotelkaufmann, Greding</span> </div>
    <div id="Layer19"><span class="Stil2"><a href="drpeterwaltermann.html">Dr. Peter Waltermann</a> </span><span class="Stil4">Internist Dr. med., Greding</span> </div>
    <div id="Layer20"><span class="Stil2"><a href="elisabethnetter.html">Elisabeth Netter</a></span><span class="Stil4"> kaufm. Angestellte, Oberm&auml;ssing, Greding </span></div>
    <div id="Layer21"><span class="Stil2">Jorgo Fotopoulos </span><span class="Stil4">Angestellter, Greding </span></div>
    <div id="Layer22"><span class="Stil2">Karlheinz Schuster </span><span class="Stil4">Hotelfachsch&uuml;ler, Greding </span></div>
    <div id="Layer23"><span class="Stil2"><a href="marionetter.html">Mario Netter</a></span> <span class="Stil4">Dipl.-Ing. (FH), Bauingenieur, Oberm&auml;ssing, Greding </span></div>
    <div id="Layer24"><span class="Stil2">Renate Batz</span> <span class="Stil4">Hausfrau, Greding </span></div>
    <div id="Layer27"><span class="Stil2">Ingrid V&ouml;gele</span> <span class="Stil4">K&ouml;chin, Landerzhofen, Greding </span></div>
    <div id="Layer26"><span class="Stil2">Franz Mendl</span> <span class="Stil4">Koch, Oberm&auml;ssing, Greding </span></div>
    <div id="Layer28"><span class="Stil2">Elfriede Schuster </span><span class="Stil4">Gesch&auml;ftsf&uuml;hrerin, Greding</span> </div>
    <div id="Layer29"><span class="Stil2">Herbert Schels</span> <span class="Stil4">Schreiner, Greding </span></div>
    <div id="Layer30"><span class="Stil2">Leonhard Wastlhuber </span><span class="Stil4">Fleischermeister, Greding</span> </div>
    <div id="Layer31"><span class="Stil2">Franz Batz</span> <span class="Stil4">Lagerist, Greding</span> </div>
    <div id="Layer32"><span class="Stil2">Marion Wastlhuber </span><span class="Stil4">Arbeiterin, Greding </span></div>
    <div id="Layer34"><span class="Stil2">Rosa Schels</span> <span class="Stil4">Hausfrau, Greding </span></div>
    <div id="Layer35">F&uuml;r weitere Informationen zu den Kandidaten auf den entsprechenden Namen klicken. </div>
    <div id="Layer37"></div>
    <div id="Layer38">501</div>
    </body>
    </html>
    
     
  2. mschoening

    mschoening Gelbe Schleswiger Reinette

    Dabei seit:
    21.02.07
    Beiträge:
    1.764
    Das hast du aber nicht selbst gecodet? Oder? :D
     
  3. Der_Leo

    Der_Leo Fießers Erstling

    Dabei seit:
    15.01.08
    Beiträge:
    126
    ...weils ziemlich durcheinander ist oder warum?
     
  4. mschoening

    mschoening Gelbe Schleswiger Reinette

    Dabei seit:
    21.02.07
    Beiträge:
    1.764
    Sieht so nach geslicetem Photoshop Layout aus und die Elemente sind nicht syntaktisch korrekt eingesetzt worden. Abgesehen davon ist alles mit "absoluten" Positionenen gecodet. Ich würde es selbst coden an deiner Stelle.
     
  5. Der_Leo

    Der_Leo Fießers Erstling

    Dabei seit:
    15.01.08
    Beiträge:
    126
    Nix Photoshop...habe die Bilder in Ebenen mithilfe von Dreamweaver eingefügt, also wenn, dann ist der Schuld. Gibt es denn keine andere Möglichkeit, als alles selbst nochmal zu coden?
     
  6. mschoening

    mschoening Gelbe Schleswiger Reinette

    Dabei seit:
    21.02.07
    Beiträge:
    1.764
    Doch sicherlich. Aber macht das Sinn? So viel Arbeit ist das nicht. Poste doch mal ein Screenshot von dem Layout wie du es gerne hättest. Mal schaun was sich machen lässt.

    Thanks,
    Max
     
  7. Der_Leo

    Der_Leo Fießers Erstling

    Dabei seit:
    15.01.08
    Beiträge:
    126
    Also:

    [​IMG]

    So siehts in Safari/Opera aus und solls ihm Endeffekt auch aussehen.

    Danke schonmal für deine Hilfe.
     
  8. mschoening

    mschoening Gelbe Schleswiger Reinette

    Dabei seit:
    21.02.07
    Beiträge:
    1.764
    Kennst du dich ein bisschen mit HTML und CSS aus? Damit ich weiss wie weit ich coden soll...
     
  9. Der_Leo

    Der_Leo Fießers Erstling

    Dabei seit:
    15.01.08
    Beiträge:
    126
    Jup, kenne mich mit beidem aus...bin kein wirkliches Genie, was CSS angeht, langt aber für das meiste.
     

Diese Seite empfehlen