[CSS] IE7 Bug

Dieses Thema im Forum "Webdesign" wurde erstellt von SnusMaster, 17. Juli 2009 .

  1. 17. Juli 2009
    IE7 Bug

    Hei Jungs, ich bin am verzweifeln, habe eine W3C konforme Page welche in Safari/Opera/Firefox und IE8 wunderbar löift, aber in IE7 und IE6 stellts einfach keinen Header dar, keine Ahnung wieso, hat jemand Ahnung? Poste mal den CSS-Code und den Html Code

    (Falls sich jemand sowieso dem Problem annimmt, hat der mir noch n Tipp wie ich das ganze sauber zentrieren kann?)

    CSS
    Code:
    body {
     font-family: Arial, Helvetica, sans-serif;
     background-color:#e1e2e3;
    }
    
    
    td {
     font-family: Arial, Helvetica, sans-serif;
    }
    
    th {
     font-family: Arial, Helvetica, sans-serif;
    }
    
    img {
     padding-bottom:5px;
     padding-left:2px;
    
    
    }
    
    marquee{
     padding-bottom:2px;
    
    }
    
    /* A links */
    a.news:link { text-decoration:none; color: #315477; }
    a.news:visited{ text-decoration:none; color:#315477; }
    a.news:hover{ text-decoration:underline; color:#000000; }
    a.news:active{ text-decoration:none; color:#333333; }
    
    
    /*Ende A links*/
    
    /*Corners*/
    div.news {
     position:relative;
    }
    
    h3 {
     font-size: 75%;
     margin:0;
     padding: 0 0 5px;
     background: #e1e2e3 url(gradient.png) repeat-x 0 -5px;
     text-align: left;
     color:#FFFFFF;
     padding-left:5px;
    }
    p.news {
     background: #e1e2e3;
     font-size:12px;
     margin:0;
     padding: 5px;
     line-height: 1.3;
     text-align: justify; 
    }
    p.impressum {
     font-size:12px;
     color:#325477;
     text-align:right;
    }
    /* Ende Corners */
    
    
    /* Site Bau */
    div.Table_01 {
     position:absolute;
     left:0px;
     top:0px;
     width:100%;
     height:100%;
    }
    
    div.nav-hp_ {
     position:absolute;
     background-image:url(images/nav-hp.png);
     left:35px;
     top:31px;
     width:174px;
     height:38px;
    }
    
    div.nav-pic_ {
     position:absolute;
     background-image:url(images/nav-pic.png);
     left:227px;
     top:31px;
     width:174px;
     height:38px;
    }
    
    div.nav-event_ {
     position:absolute;
     background-image:url(images/nav-event.png);
     left:422px;
     top:31px;
     width:174px;
     height:38px;
    }
    
    div.nav-Forum_ {
     position:absolute;
     background-image:url(images/nav-Forum.png);
     left:617px;
     top:31px;
     width:174px;
     height:38px;
    }
    
    div.header_ {
     position:absolute;
     background-image:url(images/header.png);
     left:12px;
     top:69px;
     width:800px;
     height:65px;
    }
    
    div.main_ {
    
     background-color:#e1e2e3;
     padding-top:102px;
     padding-left:31px;
     width:600px;
     float:left;
    }
    
    div.advertising {
    
     background-color:#e1e2e3;
     padding-top:119px;
     padding-left:2px;
     float:left;
     height:400px;
     width:160px;
    }
    
    
    div.footer_ {
     clear:both;
     background-image:url(images/footer.png);
     width:800px;
     height:27px;
    }
    /*Ende Site Bau */
    
    

    Und hier der Html code:

    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>
    <title>EncoreunefoisV1</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <link rel="stylesheet" type="text/css" href="design.css">
    <link rel="stylesheet" type="text/css" href="niftyCorners.css">
    <link rel="stylesheet" type="text/css" href="niftyPrint.css" media="print">
    <script type="text/javascript" src="nifty.js"></script>
    <script type="text/javascript">
    window.onload=function(){
    if(!NiftyCheck())
     return;
    Rounded("div.news","top","transparent","#32567A","border #90bbe6");
    Rounded("div.news","bottom","transparent","#e1e2e3","small border #90bbe6");
    }
    </script>
    </head>
    <body>
    
    <div class="Table_01">
    <div style="width:785px;"><p class="impressum">Impressum | Sitemap | Login</p></div>
     <div class="nav-hp_"></div>
     <div class="nav-pic_"></div>
     <div class="nav-event_"></div>
     <div class="nav-Forum_"></div>
     <div class="header_"></div>
     <div class="main_">
     <marquee behavior="alternate" scrollamount="1" scrolldelay="10"><font face="verdana" size="1">
    | <b>17.07.2009</b> Gartenplausch mit den Milestones </a> | <b>17.07.2009</b> Gletscherzirkus </a> | <a href="index2.php?site=events">[ Alle Events ]</a></font>
     </marquee>
     <div class="news">
    <h3>Aktuellste News:</h3>
     <table width="100%"><tbody><tr><td colspan="2"><p class="news"><b>16.07.2009</b> | snaplife.ch wird weitergeführt!</p></td></tr><tr><td valign="top" width="80"><div align="center"><img src="http://www.snaplife.ch/images/news/news_01.gif" alt="" border="0" hspace="0" vspace="0"></div></td><td valign="top"><p class="news">Mit grosser Freude dürfen wir mitteilen, dass das Portal snaplife.ch nun definitiv weitergeführt wird. Zur Zeit wird bereits intensiv an einer Neuprogrammierung und -Gestaltung der Webseite gearbeitet. Der Relaunch wird spätestens innerhalb eines Monats stattfinden...man darf gespannt sein.</p></td></tr></tbody></table><table width="100%"><tbody><tr><td colspan="2"><p class="news"><b>19.06.2009</b> | ....in Verhandlungen</p></td></tr><tr><td valign="top" width="80"><div align="center"><img src="http://www.snaplife.ch/images/news/news_01.gif" alt="" border="0" hspace="0" vspace="0"></div></td><td valign="top"><p class="news">Zur Zeit wird mit Interessenten zur Weiterführung von snaplife.ch diskutiert. Aus diesem Grund werden nun der Eventkalender sowie auch die Newsmeldungen wieder aktualisiert. Sobald weitere Neuigkeiten bekannt sind, werde diese hier kommuniziert.</p></td></tr></tbody></table> 
     </div>
     
     <p>
     <div class="news">
     <h3>Aktuellste Fotogallery</h3>
     <p class="news">
     <table width="100%">
     <tbody><tr valign="top">
     <td height="127" width="20%"><font color="#333333" face="Verdana, Arial, Helvetica, sans-serif" size="1"><a href="http://www.snaplife.ch/index.php?fotos=http://www.snaplife.ch/gallery2009_1/view_album.php?set_albumName=powermesse09_sa"><img src="http://www.snaplife.ch/images/thumbs/thumb_powermesse09_sa.jpg" alt="2" border="0" height="75" width="100"></a><br>
     <font color="#336699">16.05.2009</font><br>
    
     <strong>Powermesse Samstag</strong></font><font color="#333333" face="Verdana, Arial, Helvetica, sans-serif" size="1"><br>
    Visp </font></td>
     <td width="20%"><font color="#333333" face="Verdana, Arial, Helvetica, sans-serif" size="1"><a href="http://www.snaplife.ch/index.php?fotos=http://www.snaplife.ch/gallery2009_1/view_album.php?set_albumName=powermesse09_fr"><img src="http://www.snaplife.ch/images/thumbs/thumb_powermesse09_fr.jpg" alt="2" border="0" height="75" width="100"></a><br>
    
     <font color="#336699">14.05.2009</font><br>
     <strong>Powermesse Donnerstag</strong></font><font color="#333333" face="Verdana, Arial, Helvetica, sans-serif" size="1"><br>
    Visp </font></td>
     <td width="20%"><font color="#333333" face="Verdana, Arial, Helvetica, sans-serif" size="1"><a href="http://www.snaplife.ch/index.php?fotos=http://www.snaplife.ch/gallery2009_1/view_album.php?set_albumName=powermesse09_do"><img src="http://www.snaplife.ch/images/thumbs/thumb_powermesse09_do.jpg" alt="2" border="0" height="75" width="100"></a><br>
    
     <font color="#336699">14.05.2009</font><br>
     <strong>Powermesse Donnerstag</strong></font><font color="#333333" face="Verdana, Arial, Helvetica, sans-serif" size="1"><br>
    Visp </font></td>
     <td width="20%"><font color="#333333" face="Verdana, Arial, Helvetica, sans-serif" size="1"><a href="http://www.snaplife.ch/index.php?fotos=http://www.snaplife.ch/gallery2009_1/view_album.php?set_albumName=grossratsempfang%20"><img src="http://www.snaplife.ch/images/thumbs/thumb_grossratsempfang09.jpg" alt="2" border="0" height="75" width="100"></a><br>
     <font color="#336699">08.05.2009</font><br>
     <strong>Grossratsempfang</strong></font><font color="#333333" face="Verdana, Arial, Helvetica, sans-serif" size="1"><br>
    Varen </font></td>
    
     <td width="20%"><font color="#333333" face="Verdana, Arial, Helvetica, sans-serif" size="1"><a href="http://www.snaplife.ch/index.php?fotos=http://www.snaplife.ch/gallery2009_1/view_album.php?set_albumName=stockitown_release09%20"><img src="http://www.snaplife.ch/images/thumbs/thumb_stockitown_release09.jpg" alt="2" border="0" height="75" width="100"></a><br>
     <font color="#336699">02.05.2009</font><br>
     <strong>Stockitown Release CD Party</strong></font><font color="#333333" face="Verdana, Arial, Helvetica, sans-serif" size="1"><br>
    Naters </font></td>
     </tr>
     </tbody></table>
     </div>
     <p>
     <div class="news">
     <h3>Aktuellste Events:</h3>
     <table><tr> 
     <td width="84%"> 
     <table width="100%"><tbody><tr><td colspan="2"><p class="news"><b>02.07.2009</b> | Publikumswahl zur 15. «Goldenen Henne» beginnt! </p></td></tr></tbody></table><table width="100%"><tbody><tr><td colspan="2"><p class="news"><b>02.07.2009</b> | Glen Of Guinness am Openair Safiental!</p></td></tr></tbody></table><table width="100%"><tbody><tr><td colspan="2"><p class="news"><b>02.07.2009</b> | 12. International Alpine Music Festival in Saas Fee/p></td></tr></tbody></table> </td>
    
     <td width="16%"><div align="right"><a href="?site=artistpool"><img src="http://www.snaplife.ch/images/news/icon_ap_news.jpg" border="0" height="55" width="150"></a></div></td>
     </tr>
     <tr> 
     <td colspan="2" height="3"><div align="center"><img src="http://www.snaplife.ch/images/trennlinie.gif" height="3" width="500"></div></td>
     </tr>
     <tr> 
     <td> 
     <table width="100%"><tbody><tr><td colspan="2"><p class="news"><b>16.07.2009</b> | snaplife.ch wird weitergeführt</p></td></tr></tbody></table><table width="100%"><tbody><tr><td colspan="2"><p class="news"><b>14.07.2009</b> | MUND (vs) ART sucht Stimmen</p></td></tr></tbody></table><table width="100%"><tbody><tr><td colspan="2"><p class="news"><b>14.07.2009</b> | el azra open ear am 1. August in Visp</p></td></tr></tbody></table> </td>
    
     <td><div align="right"><a href="?site=rro"><img src="http://www.snaplife.ch/images/news/icon_rromb_news.jpg" border="0" height="55" width="150" class="news"></a></div></td>
     </tr>
     <tr> 
     <td colspan="2" height="3"><div align="center"><img src="http://www.snaplife.ch/images/trennlinie.gif" height="3" width="500"></div></td>
     </tr>
     </table>
     </div>
     </div>
     <div class="advertising">
     <img src="20070905-low-paying-adsense-werbung.jpg" width="160px" class="advertising"/>
     <img src="20070905-low-paying-adsense-werbung.jpg" width="160px"/>
     <img src="20070905-low-paying-adsense-werbung.jpg" width="160px"/>
     <img src="20070905-low-paying-adsense-werbung.jpg" width="160px"/>
     <img src="20070905-low-paying-adsense-werbung.jpg" width="160px"/> </div>
     <div class="footer_"></div>
    </div>
    </body>
    </html>
    
    Vielen Dank für die Hilfe...

    (BW iss ehrensache!)
     
  2. 17. Juli 2009
    AW: IE7 Bug

    Ganz ehrlich...
    Ich würd die IE7 und IE6 User (anhand des User-Agents zu erkennen) dazu auffordern, den Browser zu updaten oder sich ne Alternative zu suchen...
    Selbst YouTube hat vor einigen Tagen die Unterstützung des IE6 offiziell eingestellt.
    Denn IE6 und 7 gehören zu den Browsern die am schlechtesten bei Browsertests abschneiden und sehr wenig standardkonform sind.
    Der IE8 ist da schon etwas besser, aber am besten sind die Gecko-basierten Browser (Netscape, Flock, Firefox, Epiphany),WebKit-basierten Browser (Chrome, Iron, Safari, Midori...) und KHTML-basierten Browser (Konqueror)...
    Ansonsten darfst du inbesondere für den IE6 mit Pech die gesamte Seite umbasteln, damit sie gescheit funktioniert....

    Mfg
    TuXiFiED
     
  3. 17. Juli 2009
    AW: IE7 Bug

    Ja tolle Idee...aber IE7 macht über 50% aller Internet Explorer aus...ich bin zumindest auf IE7 angewisen!!
    Hat niemand ne Idee?

    THX
     
  4. 18. Juli 2009
    AW: IE7 Bug

    SnusMaster,

    haste da auch ne Version von, die ich/man online sehen kann?
    So fehlen leider alle anderen CSS und JS files, um komplett zu reproduzieren.

    MArc
     
  5. 23. Juli 2009
    AW: IE7 Bug

    HTML:
    /* Site Bau */
    div.Table_01 {
     position:absolute;
     left:0px;
     top:0px;
     width:100%;
     height:100%;
    }
    Div height: 100% <- !


    Div und height: 100% macht leider viele probleme ..

    Überhaupt würd ich dir ans herz legen weniger position absolute zu nutzen
    Entweder du lernst richtiges designen mit Divs oder nehm tables

    CSS 4 You - The Finest in Stylesheets <- sehr gutes tutorial wie man richtig floated etc.
    Kann nur aus erfahrung sprechen, dass sich der umstieg lohnt
     
  6. 24. Juli 2009
    AW: IE7 Bug

    Du kannst doch niemanden dazu zwingen, seinen Browser zu wechseln, nur damit DEINE Seite funktioniert. Vor allem sind bei manchen Firmen die Systeme z.B. auf den IE6 angepasst und deshalb werden keine Updates durchgeführt.
    Dass YouTube das macht, finde ich auch gut, aber ich bezweifle, dass wirklich viele den IE6 updaten werden, denn es gibt ein nettes Häckchen in dieser Infobox und schon ist die Sache vergessen.
    Und auf den IE7 zu verzichten, kannst du echt voll vergessen! Es gibt DAUs, die wissen noch nicht mal, dass es nen 8er gibt! Wenn deine Zielgruppe Nerds sind, dann kannste auf alle alten Browser n, aber sonst ist der Kunde König und wenn der den IE6 hat, wird er ihn nicht wegen einer Seite wechseln.
    Kannst ja genauso eine Funktion einbauen, die nur für den FF ist und sagen: Für diese Seite braucht man den FF. Der ist erstmal total lahm und die habens mitm 3.5er immer noch nicht auf die Reihe gekriegt, außerdem will niemand hören: DEN nimmst du jetzt für meine Seite.

    Und zum Thema^^: Wäre echt gut, wenn du die Seite mal zeigen könntest, lässt sich besser untersuchen.
     
  7. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.