Probleme bei der Darstellung bei Internet Explorer

Hilmy

Mitglied
Hallo Leute

ich habe ein Problem meine Seite beim IE richtig dar zu stellen. Ich bin mir nicht ganz sicher, ob ich damit hier richtig bin, da ich keine Ahnung habe wo das Problem liegt. Es könnte auch ein CSS oder PHP Problem sein.

Ich habe meine Seite groehl.ch eigentlich für den Mozilla Firefox designed und da sieht das ganze eigentlich recht gut aus. Auch mit google Chrome funktioniert es gut. Ich vermute Safari und Opera sollte auch hin hauen. Nur der IE 8 macht Faxen.

Es sollte sich dabei nicht um den altbekannte Boxmodell Fehler des IE halten. Dieses Problem hatte ich bereits und es sollte eigentlich mit dem folgenden Code behoben werden. Dies hat auch mal funktioniert.
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

Das ganze sieht jetzt wider ähnlich aus wie damals mit dem Boxmodellfehler, nur der Abstand hat sich nochmals etwas erhöht. Das Maincontent Div ist gegenüber dem Link Div nach unten verschoben. Ausserdem rückt ein Teil des Footers nach oben. Dem kann ich engegen wirken, in dem ich dem Footer Solid Borders verpasse. Dies ändert aber den Abstand zwischen den anderen Divs nichts. Auch möchte ich aus Design Gründen dieses solid Border im Footer vermeiden.


Ich weis nicht, ob es Sinn macht, hier meinen Komplette Quellcode ein zu fügen, da er ziemlich viele PHP includes enthält. Vieleicht währe es einfacher, wenn ihr euch einfach das Original
mal anschaut. Viel erkennt jemand daran bereits ein Grundlegendes Problem. Falls jemand aber den gesammten Quellcode oder ein Teil davon sehen möcht, werde ich diesen selbstverstöndlich noch eintragen.

Würde mich freuen, falls jemand hier einen Geistesblitz haben würde. Ich habe keine Idee wo ich dieses Problem her kommen könnte. Ich wäre auch schon froh, wenn es jemand etwas eingrenzen könnte.

Greetz Hilmy
 
Hi,

ich würde zunächst mal den HTML- und CSS-Code validieren, denn es ist beispielsweise nur eine Doctype-Deklaration zulässig, und nicht derer drei, aber auch im Stylesheet sind mir diverse Syntax-Fehler ins Auge gestochen.
Wenn die Fehler bereinigt sind, und im IE8 weiterhin Darstellungsfehler produziert werden, kann man sich dem Code gezielt zuwenden.

mfg Maik
 
Oooppsss.

Da gibts ja noch so einiges zu erledigen :(
Meint ihr es würde sich lohnen, wenn ich schon dabei bin auf xhtml um zu stellen? Und wenn ja, welche Version würdet ihr empfehlen?

Danke für die coolen chek Links.

Greetz Hilmy
 
Habe nun einige Fehler behoben. Die CSS sind alle behoben, die anderen nur Teilweise. Es ist aber keiner dabei, der so aussiet, als könne er diesen Fehler bei der Darstellung im IE verursachen.

Hat noch jemand eine Idee, wesshalb es nur beim IE Probleme mit der Darstellung gibt? Bei den anderen funktioniert es ja einwandfrei :confused:

Ich stell jetzt hier doch mal den gesammten Quelltext des Indexes rein vileicht versteht es ja jemand. Ich versuche schon seit Stunden und komm einfach nicht drauf :(

HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta name="verify-v1" content="2mWhxmSXjRAWCHussoFPCcpgihIgUWnza1KLKasxHNw=">
<link rel="stylesheet" type="text/css" href="style.css">
<style type="text/css">

</style>
<title>
Groehl.ch. Die Schweizer Witze seite zum Gröhlen :-) Lustige Witze und Videos</title>
<META NAME="Author" CONTENT="Angelo Kipfer">
<META NAME="Publisher" CONTENT="Angelo Kipfer">
<META NAME="Copyright" CONTENT="Angelo Kipfer">
<META NAME="Revisit" CONTENT="After 2 days">
<META NAME="Keywords" CONTENT="Witze, Videos, lustig, lachen, gröhlen, Community, Web 2.0, Arzt,Blondinen,English Jokes, Fieses, Frauen, Kirche, Microsoft, Politik, Polizei, Schule, Tiere, Diverse">
<META NAME="Description" CONTENT="www.Groehl.ch ist die neue Schweizer Witze Community. Du kannst hier viel coole Witze und Videos sehen oder auch selber welche hochladen. Wenn du dich anmeldest, bekommst du eine eigene Seite, auf der du die Witze die du hochgeladen hast, mit deinen Freunden teilen kannst. Ausserdem kannst du Witze anderer User kommentieren und diskutieren">
<META NAME="Abstract" CONTENT="www.Groehl.ch ist die neue Schweizer Witze Seite. Du kannst hier viel coole Witze und Videos sehen oder auch selber welche hochladen.">
<META NAME="page-topic" CONTENT="Kultur">

<META NAME="page-topic" CONTENT="HTML-Formular">
<META NAME="audience" CONTENT=" Alle ">
<META NAME="Robots" CONTENT="index, follow, noimageindex, noimageclick">
<META NAME="Language" CONTENT="de">

<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1" >

<meta name="verify-v1" content="2mWhxmSXjRAWCHussoFPCcpgihIgUWnza1KLKasxHNw=">
</head>
<body style="background-image: url(gradient36818202.png); background-repeat: repeat-y; background-color: #66ff66; ">




<center>
<div id="topbar">

<center>
<img src="logo.png" alt="Logo">


</center>

</div>

<div id="maincontent">


<div id="mainleft">

<div id="left1">
<H2>
 

<H2>
<a href="index.php"><img src="config/button/menuebuttonblue.gif" alt="Menue" border="0"></a>

</H2>
<div align="left">
<h5>
<center>
<a href="index.php?pid=witze& page=1"><img src="config/button/witzebuttonblue.gif" alt="Witze" border="0"></a>
</center>


<p>

<center>
<a href="index.php?pid=video"><img src="config/button/videobuttonblue.gif" alt="Videos" border="0"></a>
</center>
<p>

<p>
<center>
<a href="index.php?pid=upload"><img src="config/button/uploadbuttonblue.gif" alt="Upload" border="0"></a>
</center>
<p>
<center>
<a href="index.php?pid=alinkpage"><img src="config/button/linkbuttonblue.gif" alt="Links" border="0"></a>
</center>
<p>
<center>
<a href="index.php?pid=login"><img src="config/button/loginbutton.gif" alt="Login" border="0"></a>
</center>
<p>
<center>
<a href="index.php"><img src="config/button/homebuttonblue.gif" alt="Home" border="0"></a>
</center>
<p>




<center>
<table cellpadding="1" cellspacing="0" style="border:1px solid #000000">
  <tr> 
    <td width="150"><b><font face="Arial, Helvetica, sans-serif" size="2"><a href="http://www.order-monitor.de/" target="_blank"><img src="counter.gif" width="16" height="16" border="0" /></a> Besucher Statistik </font></b>    </td>
  </tr>
  <tr> 
    <td style="border-top:1px solid #000000"> 
      <font face="Arial, Helvetica, sans-serif" size="1">

      &raquo; 3 Online<br>
      &raquo; 201 Heute<br>
	  &raquo; 666 Woche<br>
	  &raquo; 666 Monat<br>
	  &raquo; 4355 Jahr<br>

      &raquo; 4355 Gesamt
        <hr noshade="noshade" />
		Rekord: 213 (23.05.2009)</font>
		<div align="center">
      <font style="font-size:9px;" face="Arial, Helvetica, sans-serif">(<a href="http://www.vonderborn.com/php_counter_script.php" target="_blank">PHP Counter</a>)</font></div>
    </td>
  </tr>

</table>
 

<p>

</center>



</div>

</h5>

</div>




<P>





<div id="vote">

Please Vote for Groehl.ch:<P>
<script language="Javascript" type="text/javascript" src="http://funny-toplist.de/image1.php?id=Hilmy"></script>
<p>
<script language="JavaScript">function hit(hitlink) {if(document.images) {(new Image()).src=''+hitlink+'';}return true;}</script><a href="http://www.germantop.com/" onmousedown="return hit('http://www.germantop.com/in.php?id=1929')" target="_blank"><img src="http://www.germantop.com/images/vote2.gif" alt="GermanTop - Topliste Deutschland" border="0"></a>
<P>
<!--
* Social Bookmark Script
* @ Version 2.5
* @ Copyright (C) 2006-2009 by Alexander Hadj Hassine - All rights reserved
* @ Website http://www.social-bookmark-script.de/
* @
* @ Bei Nutzung des Scripts muessen alle unsere Copyright-Hinweise und Links in dem Script selbst,
* @ sowie in der Anzeige/Ausgabe unveraendert bleiben!
* @ 
* @ D.h., sie duerfen nicht entfernt, umgewandelt, versteckt oder unsichtbar gemacht werden,
* @ es sei den Sie verlinken http://www.social-bookmark-script.de/ mindestens 1 mal
* @ "suchmaschinenfreundlich" von Ihrer Startseite!
-->

<a target="_blank" style="text-decoration:none; font-size:11px; font-family:Arial; color: #2A4956;" href="http://www.social-bookmark-script.de/">Bookmark Buttons</a><br>
<div style="border-top-style:solid; padding-top:3px; border-top-width: 1px; border-top-color: #2A4956; float: center;">
<script language="JavaScript" type="text/JavaScript">
<!--
function Social_Load() { 
var d=document; if(d.images){ if(!d.Social) d.Social=new Array();
var i,j=d.Social.length,a=Social_Load.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.Social[j]=new Image; d.Social[j++].src=a[i];}}
}
Social_Load('http://www.social-bookmark-script.de/img/bookmarks/wong_ani.gif','http://www.social-bookmark-script.de/img/bookmarks/facebook_ani.gif','http://www.social-bookmark-script.de/img/bookmarks/google_ani.gif','http://www.social-bookmark-script.de/img/bookmarks/what_ani.gif','http://www.social-bookmark-script.de/load.gif')
function schnipp() { 
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 schnupp(n, d) { 
  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=schnupp(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
  }
function schnapp() { 
  var i,j=0,x,a=schnapp.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
  if ((x=schnupp(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
  }
  //-->
</script>
<noscript><a href="http://www.social-bookmark-script.de/" target="_blank">web2.0 optimierung</a></noscript>
	<a rel="nofollow" style="text-decoration:none;" href="http://www.mister-wong.de/" onclick="window.open('http://www.mister-wong.de/index.php?action=addurl&amp;bm_url='+encodeURIComponent(location.href)+'&amp;bm_notice=&amp;bm_description='+encodeURIComponent(document.title)+'&amp;bm_tags=');return false;" title="Bookmark bei: Mr. Wong" onmouseover="schnapp('wong','','http://www.social-bookmark-script.de/img/bookmarks/wong_ani.gif',1)" onmouseout="schnipp()" > <img style="padding-bottom:1px;" src="http://www.social-bookmark-script.de/img/bookmarks/wong.gif" alt="Bookmark bei: Mr. Wong" name="wong" border="0" id="wong"> </a>
		<a rel="nofollow" style="text-decoration:none;" href="http://www.facebook.com/" onclick="window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(location.href)+'&amp;t='+encodeURIComponent(document.title));return false;" title="Bookmark bei: Facebook" onmouseover="schnapp('Facebook','','http://www.social-bookmark-script.de/img/bookmarks/facebook_ani.gif',1)" onmouseout="schnipp()" > <img style="padding-bottom:1px;" src="http://www.social-bookmark-script.de/img/bookmarks/facebook.gif" alt="Bookmark bei: Facebook" name="Facebook" border="0" id="Facebook"> </a>
		<a rel="nofollow" style="text-decoration:none;" href="http://www.google.com/" onclick="window.open('http://www.google.com/bookmarks/mark?op=add&amp;hl=de&amp;bkmk='+encodeURIComponent(location.href)+'&amp;annotation=&amp;labels=&amp;title='+encodeURIComponent(document.title));return false;" title="Bookmark bei: Google" onmouseover="schnapp('Google','','http://www.social-bookmark-script.de/img/bookmarks/google_ani.gif',1)" onmouseout="schnipp()" > <img style="padding-bottom:1px;" src="http://www.social-bookmark-script.de/img/bookmarks/google.gif" alt="Bookmark bei: Google" name="Google" border="0" id="Google"> </a>

		<a rel="nofollow" style="text-decoration:none;" href="http://www.social-bookmark-script.de/social.bookmarking.htm" target="" title="Information" onmouseover="schnapp('Information','','http://www.social-bookmark-script.de/img/bookmarks/what_ani.gif',1)" onmouseout="schnipp()" > <img style="padding-bottom:1px;" src="http://www.social-bookmark-script.de/img/bookmarks/what.gif" alt="Information" name="Information" border="0" id="Information"> </a>
		</div>
</div>
</center>
</div>


<div id="mainmiddle">

<div id="blue">
<H2>

</H2>

<p>
<p>
<p>

<h5>
Die Schweizer Witze Seite.<BR>
<div align="left">
<p>
Lustige Witze und Videos. 
<p>
Der Humor rückt den Augenblick an die richtige Stelle. Er lehrt uns die wahre Größenordnung und die gültige Perspektive. Er macht die Erde zu einem kleinen Stern, die Weltgeschichte zu einem Atemzug und uns selber bescheiden.
<BR>Erich Kästner (1899 - 1974)
<P>
Wenn du findest, dass hier ein Video oder sonst etwas fehlt, so schreib mir doch ein Mail auf info@groehl.ch.
<BR>
Vielen Dank

<BR>
<div id="jokes" class="jokes" . clear ><div id="blueline" class="jokes" . clear ><center>Der neuste Witz </center></div><P><div id="jokes_title">Viagra</div><P><div class="jokes_main">Zürcher haben ihre eigene Art, mit Viagra umzugehen. <br />Sie werfen die Tabletten in den Wald, um an Weihnachten Christbäume mit Ständern zu haben.</div><P><div class="jokes_cat"> Kategorie: <a href=index.php?pid=witze&cat=Zürcher&page=1>Zürcher</a></div><P><div id="jokes_datetime"> Hochgeladen am:<BR>2009-06-04 15:09:55<BR>Hochgeladen von <a href="http://www.groehl.ch/index.php?pid=userpage2&UserID=18">Angi</a></div> </div></h5>

<script type="text/javascript"><!--
google_ad_client = "pub-2487931264122890";
/* 468x60, Erstellt 03.06.09 */
google_ad_slot = "6378433526";
google_ad_width = 468;
google_ad_height = 60;
//-->

</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>

<H2>
News:
</H2>
31.5.2009<BR>
Ab sofort werden neben den Witzen, die von Registrierten Usern hoch geladen wurden, ihr Name mit einem Link auf die eigene Page angezeigt.<P>
21.5.2009<BR>
Und schon wider gibt es was neues auf Groehl.ch :-). Wer angemeldet ist, kann Kommentare zu Witzen oder zu den Userpages der anderen Benutzer hinterlassen. Sehen dürfen diese natürlich alle, egal ob angemeldet oder nicht.
<P>
19.5.2009<BR>

Der Userbereich funktioniert nun. Wenn du eingeloggt bist, werden dir die Witze die du hochlädst zugeordnet und du kannst auf deiner persönlichen Seite sehen, was du alles hochgeladen hast.<BR> Ausserdem kannst du deine Seite an deine Freunde schiken, damit auch sie über deine Lieblingswitze lachen können.<BR>
Wenn du auch dabei sein möchtest, kannst du dich <a href="index.php?pid=join">hier</a> anmelden.
<P>
Leider hat ein Bot immer wider Werbung geuploaded auf Groehl.ch.<BR>
Daher sah ich mich leider gezwungen,ein captscha Script ein zu führen in der Upload Section.
<H5>
  
</h5>


</center>
</div>

</top>


<div id="right">

 
<div id="right1">

<script type="text/javascript"><!--
google_ad_client = "pub-2487931264122890";
/* 120x240, Erstellt 03.02.09 */
google_ad_slot = "4974604707";
google_ad_width = 120;
google_ad_height = 240;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>



</div>
<bottom>
</bottom>
</div>

</div>

</div>



<div id="down">


<center>

Designed For <a href="http://www.mozilla-europe.org/de/firefox/">Mozilla Firefox</a>
<BR>
Last Update: 31.5.2009


</center>

</div>
</bottom>
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-8535474-1");
pageTracker._trackPageview();
} catch(err) {}</script>
</body>

</html>

Würde mich echt freuen, diesem Problem endlich auf die schliche zu kommen.

Greetz Angelo
 
Moin,

die Ursache ist hier dieses <center>-Element:
Code:
<center>
<div id="topbar">


mfg Maik
 
Vielen dank. Daran lags. :)
Ich verstehe aber immer noch nicht ganz, wiso dieses Problem nur beim IE aufgetreten ist :confused:

Greetz Hilmy
 
Entgegen den anderen Browsern hat er versucht, die Blöcke in der Seite zu zentrieren, was zum Umbrechen des rechten Spaltenblocks geführt hat.

mfg Maik
 
Zurück