• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

ie7 und Firefox

S

SimoNxD

Mitglied
Hey Leute,

hab ne Frage bezüglich des wohl ältesten Thema ....

Meine Seite wird im IE7 anders angezeigt als in Firefox...
Im IE8 wirds genau wie in Firefox angezeigt (Gott sei dank) so muss ich nur eine extra CSS datei für ie7 anlegen.

Aber nun die Frage bzw. hier erstmal 2 Screens (von IE7 und Firefox)

Internet Explorer 7

ie7ansichtgrlxz0vdpu.jpg


Firefox:

firefoxansichtypx9l4b8i3.jpg



Der CSS Code für das Menü:

Code: 
#container_navigation {
    margin:0px auto;
    padding:24px 0px 0px;
}

#mainnav {
    list-style: none;
    padding: 0;
}

#mainnav li{
    float: left;
    text-align: center;
    width: 25%;
}

a.mainlevel {
    background:    no-repeat -180px 0;
    color: #FFFFFF;
    display: block;
    font-size: 12px;
    height: 32px;
    padding: 24px 0 0 0;
    background-image:url(../images/navi.png);

}

a.mainlevel:hover {
    background-position: -180px -57px;
    color: #FFFFFF;
    text-decoration: none;
}

Jetzt die Frage:
Welche Befehle führt der IE7 nicht aus?
Bzw. welche CSS codes D:

MfG
Simon
 
Ein Link zur Seite wäre besser als die Bilder.

Allerdings wäre mir der IE7 völlig wurscht
 
Die Seite ist Lokal auf meinem PC, sprich ich rufe sie via Localhost auf.

Das Problem einige leute benutzen nunmal noch den IE7 der rest wird ja auch angezeigt wie er soll.
Nur das Menü nicht

Nochmal der Aufbau vom Menü

PHP: 
<div id="container_navigation">
<?php if(isset($_SESSION['user_id'])) { ?>
        <ul id="mainnav" class="clearfix">
            <li><a class="mainlevel first" href="?s=login">News</a></li>

            <li><a class="mainlevel" <?php if($_SESSION['user_admin']>=1){echo 'href="?s=ticket_edit">Tickets bearbeiten';} elseif ($_SESSION['user_admin'] == 0){echo 'href="?s=ticket_write">Ticket Support';}?></a></li>
          
            <li><a class="mainlevel" <?php if ($_SESSION['user_admin']==1){echo 'href="?s=ticket_weiter">Tickets weiterleiten';} elseif ($_SESSION['user_admin'] == 0){echo 'href="?s=middleman">Middleman Anfrage';}  elseif  ($_SESSION['user_admin'] >= 2){echo 'href="?s=mm_bearbeiten">Middleman bearbeiten';}?></a></li>
          
            <li><a class="mainlevel last" <?php if($_SESSION['user_admin']>=1){echo 'href="?s=panel">GM Panel';} elseif ($_SESSION['user_admin'] == 0){echo 'href="?s=itemshop">Itemshop';}?></a></li>
        </ul>
<?php ;} ?>
    </div>
 
Der IE 7 unterstützt den W3C-Standard nur mangelhaft, wodurch es zu Abweichungen bei der Darstellung im Vergleich zu aktuellen Browser kommen kann.

Entweder baust du zusätzlich ein IE7-optimiertes Styling und inkludierst dieses per CSS Browserhacks, respektive mittels eines separaten Stylesheets über Conditional Comments, oder verwendest ein Crossbrowser-kompatibles Framework wie Bootstrap - in der alten Version 2.3x allerdings. Die dritte Möglichkeit wäre, den IE7 einfach zu ignorieren.
 
@djheke, ändert leider auch nix :(

Hier nochmal der Aufbau meiner Seite:

HTML: 
<div id="page">
    <div id="container_navigation">
<?php if(isset($_SESSION['user_id'])) { ?>
        <ul id="mainnav">
            <li><a class="<?php if($currentpage == "/ipanel/index.php?s=login" || $currentpage == "/ipanel/index.php" ){echo 'mainlevel first_active';} else {echo 'mainlevel first';} ?>" href="?s=login">News</a></li>

            <li><a class="<?php if($currentpage == "/ipanel/index.php?s=ticket_write" || $currentpage == "/ipanel/index.php?s=ticket_edit" ){echo 'mainlevel m_active';} else {echo 'mainlevel';} ?>" <?php if($_SESSION['user_admin']>=1){echo 'href="?s=ticket_edit">Tickets bearbeiten';} elseif ($_SESSION['user_admin'] == 0){echo 'href="?s=ticket_write">Ticket Support';}?></a></li>
          
            <li><a class="<?php if($currentpage == "/ipanel/index.php?s=middleman" || $currentpage == "/ipanel/index.php?s=mm_bearbeiten" ){echo 'mainlevel m_active';} else {echo 'mainlevel';} ?>" <?php if ($_SESSION['user_admin']==1){echo 'href="?s=ticket_weiter">Tickets weiterleiten';} elseif ($_SESSION['user_admin'] == 0){echo 'href="?s=middleman">Middleman Anfrage';}  elseif  ($_SESSION['user_admin'] >= 2){echo 'href="?s=mm_bearbeiten">Middleman bearbeiten';}?></a></li>
          
            <li><a class="<?php if($currentpage == "/ipanel/index.php?s=is_shop" || $currentpage == "/ipanel/index.php?s=panel" || $currentpage == "/ipanel/index.php?s=rundmail" || $currentpage == "/ipanel/index.php?s=ankuendigung" || $currentpage == "/ipanel/index.php?s=myworktime" || $currentpage == "/ipanel/index.php?s=rund_write"){echo 'mainlevel last_active';} else {echo 'mainlevel last';} ?>" <?php if($_SESSION['user_admin']>=1){echo 'href="?s=panel">GM Panel';} elseif ($_SESSION['user_admin'] == 0){echo 'href="?s=itemshop">Itemshop';}?></a></li>
        </ul>
<?php ;} ?>
    </div>
</div>

Und hier die CSS class die vorkommen:

Code: 
#page {
    margin:0px auto;
    width: 723px;
    height: 533px;
    background-image:url(../images/bg.png);
    color:#e4a87a;
}

#container_navigation {
    margin:0px auto;
    padding:24px 0px 0px;
}

#mainnav {
    list-style: none;
    padding: 0;
    margin-left: 0px;
}

#mainnav ul {
    padding:0px;
    margin:0px;
}

#mainnav li{
    float: left;
    text-align: center;
    width: 25%;
}

a.mainlevel {
   background:   no-repeat -180px 0;
   color: #FFFFFF;
   display: block;
   font-size: 12px;
   height: 32px;
   padding: 24px 0 0 0;
   background-image:url(../images/navi.png);
}
 
Zuletzt bearbeitet:
Es ist nicht notwendig, den Code hier wiederholt zu posten, und auf den Screenshots lässt sich das Problem doch bereits erkennen. Im IE7 wird das erste Menü-Item eingerückt. Was nachfolgend dafür sorgt, dass das letzte keinen Platz mehr hat und in die nächste Zeile umbrochen wird.

Einen Lösungsansatz hatte ich dir bereits genannt. Warum ignorierst du das?
 
Das in den Header deiner Index.html rein
Code: 
<!--[if IE 7]>
<link rel="stylesheet" href="style_ie7.css" type="text/css">
<![endif]-->

Und in der Datei gibst du deiner Liste oder welches Element auch verantwortlich für die Einrückung ist einen negativen Margin. Ist keine schöne Lösung aber ohne Link womit wir uns das angucken können kann man dir nicht mehr helfen.

Internet Explorer interpretiert einige Sachen anders als die anderen gängigen Browser. Meistens muss man nur sowas wie left:0; oder ähnliches hinzufügen damit es auch da klappt. Musste halt selbst mal untersuchen und schauen was das Problem ist.

Aber ganz ehrlich, Leute die den IE7 noch benutzen habens nicht besser verdient. Bei sowas würde ich nur ein Popup erscheinen lassen dass der Browser aktualisiert werden muss.

http://browser-update.org/de/
 
Es könnte aber auch an den Rundungsfehlern im IE liegen. Also versuch einfach mal von 25% auf 24.9% zu reduzieren.
Zur Not auch in einer extra Style-Datei für den IE < 8
 
Nicht nur der IE 7, auch der IE 8 erzeugt gelegentlich eine abweichende Darstellung. Was sich bemerkbar macht, wenn man innerhalb einer Seite viel mit margin und padding arbeitet. Bei meinem ersten Job musste ich noch Seiten für die alten IEs optimieren und hatte dabei den Umgang mit Browserhacks erlernt. Später bin ich dazu übergegangen, Frameworks, namentlich Bootstrap einzusetzen und das Default Styling nach Möglichkeit nicht zu verändern. Das spart viel Zeit.

Mittlerweile befinden wir uns an der Schwelle zum Jahr 2014 und an die Stelle von Crossbrowser-Kompatibilität ist Cross-Device-Kompatibilität gerückt. Wenn eine Seite auf dem Samsung Galaxy oder iPhone nicht gut aussieht, braucht man über vergangene IE-Generationen gar nicht mehr nachzudenken. Dieser ganze IE-Optimierungswahn ist ebenso unsinnig wie die Implementierung von Fallbacks für User, die JavaScript disabled haben könnten.
 
Keine Ahnung was du uns damit sagen willst, aber normalerweise macht selbst der IE7 keine Probleme mit einer einfachen horizontalen Navigation(Liste) - abgesehen von den Rundungsfehlern. Vielmehr werden sich im CSS und HTML-Quelltext vom Fragesteller noch weitere Fehler eingeschlichen haben die uns weiterhin verborgen bleiben, solange wir nur Fragmente seiner Arbeit zu sehen bekommen.

Ich wünsche euch allen noch einen schönen 2. Weihnachtsfeiertag und ein gesundes neues Jahr 2014.
 
Ich vermute, dass der Seite ein qualifizierter Doctype fehlt.
Ansonsten wie bereits erwähnt: bitte ein Link.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben