CSS funktioniert nicht im IE?

Ihre html-ist ungültig in vielerlei Hinsicht. Bitte Update, das erste.

InformationsquelleAutor Kristof Neirynck

Die Schnelle Lösung: Entfernen von "overflow: auto;" aus #wrapperbig und #wrapper.

Diese erhalten die Inhalte angezeigt werden.

Jedoch sicher sein, einen Blick auf die anderen Antworten. Sie haben gute Punkte.

InformationsquelleAutor Paxenos

Ich auch vor dem gleichen problem und eine Lösung gefunden, nach einigen Recherchen.

1. Nicht CSS-code auf die HTML-Datei
2. Eine separate CSfile und link, um es mit <link href="css/style.css">
3. Und immer <!DOCTYPE> - tag auf jeder HTML-Seite //*Dies ist die wichtigste Lösung

InformationsquelleAutor NAAFI

Habe ich nicht FireBug auf mich jetzt (wenn Sie nicht über diese Erweiterung verfügen - machen Sie es!) Aber mit Bilder so, wie Sie jetzt gerade sind, ist das problem.

Verwenden Sie CSS, um einen "background-image" - Attribut für Ihre Website die wichtigsten Inhalte. Zum Beispiel:

<style>
.Page
{
    background-image : url(../images/site_bg.png) no-repeat;
    width : 600px; /* Image width here */
    heigth : 500px; /* Image height here */
    padding-top : 15px; /* top text offset here */
    padding-left : 15px; /* left text offset here */
    padding-right : 15px; /* right text offset here */
    padding-bottom : 15px; /* bottom text offset here */
}
</style>

...

<div class = "Page">
 <!-- Content -->
</div>

Dass funktioniert viel besser, und funktioniert in allen Browsern Prima 🙂

Antwort zu Kommentar

Ich will nicht sagen, dass Ihr falsch, aber wenn ich klicken und ziehen Sie die hintergrund-Bilder mit meinem Maus-cursor, der bedeutet, dass Sie mit einem IMG-tag, um zu zeigen, den hintergrund anstelle von (oder in Verbindung mit) die background-image-Attribut. Ich kann fast gurentee, das ist Ihr problem. Entfernen Sie alle img-tags und ersetzen Sie Sie mit divs und background-image Stil und Ihr problem wird gelöst werden.

Wenn ich firebug auf mir, ich könnte mehr ins detail gehen.

Zweiten edit mit Beispiel-code

Hier einige grobe code, kann Ihnen helfen, entfernen Sie Ihre unnötigen Bild verwenden.

<style>
    .Container { margin : auto; width : 600px; /* BG and Header Width here */ }

    .Header
    {
        background-image : url(../images/site_header.png) no-repeat;
        width : 600px; /* Image width here */
        heigth : 500px; /* Image height here */
        padding-top : 15px; /* top text offset here */
        padding-left : 15px; /* left text offset here */
        padding-right : 15px; /* right text offset here */
        padding-bottom : 15px; /* bottom text offset here */
    }

    .Header .Link1:link, .Header .Link1:visited, .Header .Link2:link, .Header .Link2:visited
    {
        width : 60px;
        heigth : 60px;
        display : block;
        float : left;
        margin : 10 20px;
    }

    .Header .Link1:link, .Header .Link1:visited
    {
        background-image : url(../images/link1.jpg);
    }

    .Header .Link2:link, .Header .Link2:visited
    {
        background-image : url(../images/link2.jpg);
    }

    .Page
    {
        background-image : url(../images/site_bg.png) no-repeat;
        width : 600px; /* Image width here */
        heigth : 500px; /* Image height here */
        padding-top : 15px; /* top text offset here */
        padding-left : 15px; /* left text offset here */
        padding-right : 15px; /* right text offset here */
        padding-bottom : 15px; /* bottom text offset here */
    }
</style>

...

<div class = "Container">
  <div class = "Header">
    <a href = "link1" id = "Link1"></a>
    <a href = "link2" id = "Link2"></a>
  </div>
  <div class = "Page">
    Content
  </div>
</div>

🙂

InformationsquelleAutor nlaq

Vielen Dank für Ihre Anregungen jeder. Der Großteil der Inhalte zeigt sich (relativ, wie es sein sollte) auf IE jetzt, außer der Fußzeile, die schneiden sich meine Seite bei einem Brutto-Mode (haha). Ich sehe, was Sie sagen, Nelson LaQuet, über die header-Bilder, die werde ich haben, um zu versuchen und spielen Sie mit Ihnen, ich bin noch neu in CSS und herauszufinden, dass Sie alle richtig platziert ist, mit einer image-map Kopfschmerzen war genug da ist. Für den Doctype, ich habe es, wie Sie mir erzählte, es schien, als muck sich einige Inhalte noch auf Firefox, so dass ich weiß, ich muss etwas mehr Fehler durch zu gehen. Wenn ich es entfernen, sah alles wieder normal aus. Die "woowoo" mit der absoluten Positionierung waren ziemlich viel ist notwendig, da die Positionierung verwendete Methode war die EINZIGE Möglichkeit, die ich finden konnte, um die Arbeit mit der hintergrund-Bilder und header-Bilder im Takt, mit dem Spalten-divs an der richtigen Stelle. Zumindest habe ich einige positive Fortschritte, aber ich denke, ich habe mehr Arbeit vor mir :/Nur wünschte, es war ein bisschen leichter zu korrigieren, wie es aussieht, gut im Firefox. Oh gut, vielen Dank nochmal für Eure Hilfe, Jungs!

Shannon

InformationsquelleAutor

Nicht nur Leerzeichen vor:

    <!DOCTYPE html>

aber auch das entfernen von Leerzeichen vor der geschweiften Klammern in deinem Stylesheet (CSS-Datei).
Beispiel eines einfachen Stylesheets (vorstellen, dass es am linken Rand in deinem text-editor):

    h1{
     font-family:Arial;
     color:purple;
    }

InformationsquelleAutor nottmb