Dominik: Unterschiedliche Anzeige der CSS-Datein in Firefox und IE

Hallo,

wie so viele starte ich auch erst seit kurzem in die HTML-Welt.
Viel Basteln im Dreamweaver hat mir eine einigermaßen verknüpftige Seite mit Firefox eingebracht, und wie bei so vielen Laien hielt die Freude nur so lange an, bis dass ich die Seite im IE aufmachte (und sie völlig "zerschossen" angezeigt wurde)

Jetzt ging ich hin und habe mit CSS jede einzelne Zeile definiert, in der Hoffnung das Problem zu Umgehen: Pustekuchen.

Die Weiten stimmen, nur zerschisst mir der IE die Höhen komplett.

Optional hänge ich Euch mal die CSS.Datein an:

Vielleicht hat jemanden einen Tipp für mich!

Wäre fein,
liebe Grüße.

.Kastenoben {
height: 45px;
text-align:center;
background:#004287;
font-size:100%;
font-family:Arial, Helvetica, sans-serif;
border-color:#FFFFFF;
border-style:solid;
border-width:0px 0px 1px 1px;
}

.Abstandhalter {
height: 45px;
width: 2px;
background:#004287;
border-color:#FFFFFF;
border-style:solid;
border-width:1px 1px 1px 1px;
}

.Abstandhalteraußen {
height: 45px;
width: 2px;
background:#004287;
border-color:#FFFFFF;
border-style:solid;
border-width:1px 0px 1px 1px;
}

.Linkfenster1 {
height: 45px;
width: 177px;
background:#C5C5C5;
text-align:center;
font-size:100%;
font-family:Arial, Helvetica, sans-serif;
border-color:#FFFFFF;
border-style:solid;
border-width:1px 1px 1px 1px;
}

.Linkfenster2 {
height: 45px;
width: 178px;
background:#C5C5C5;
text-align:center;
font-size:100%;
font-family:Arial, Helvetica, sans-serif;
border-color:#FFFFFF;
border-style:solid;
border-width:1px 1px 1px 1px;
}

.logofenster {
height: 90px;
width: 120px;
text-align:center;
border-color:#004287;
border-style:solid;
border-width:2px 0px 0px 2px;
}

.navileister {
width: 120px;
min-height: 450px;
background:#004287;
border-color:#FFFFFF;
border-style:solid;
border-width:1px 1px 0px 0px;
}

  1. Hi Dominik!

    Die Weiten stimmen, nur zerschisst mir der IE die Höhen komplett.
    Optional hänge ich Euch mal die CSS.Datein an:

    Eine Beispielseite wäre optimal.

    Vielleicht hat jemanden einen Tipp für mich!

    Es gibt noch andere Eigenschaften außer height und border, die die Höhe eines Elements bestimmen, z. B. line-height, margin und padding.

    MfG H☼psel

    --
    "It's amazing I won. I was running against peace, prosperity, and incumbency."
    George W. Bush speaking to Swedish Prime Minister unaware a live television camera was still rolling, June 14, 2001
    Selfcode: ie:% fl:( br:> va:) ls:& fo:) rl:? n4:& ss:| de:] js:| ch:? sh:( mo:) zu:)
    1. Moin Hospel,

      ich will gerade die Grundseite für eine ganze HP erstellen.

      Dafür gibt es eine Navigationsleiste oben und an der Seite.

      Die obere Navigationsleiste ist mit CSS definiert und sollen eine entsprechende Höhe haben.

      .Kastenoben  (Höhe 45 Px)
      .Abstandhalter (Höhe 45 Px)
      .Abstandhalteraußen (Höhe 45 Px)
      .Linkfenster1 (Höhe 45 Px)
      .Linkfenster2 (Höhe 45 Px)

      Diese Information habe ich jetzt nicht in den Quellcode, sondern (sogar) die CSS.Datein reingeschrieben.

      Firefox zeigt mir das wunderbar an,
      IE stellt plötzlich nicht ansatzweise definierte Höhen dar.

      Ist das Problem, dass ich die einzelnen Zeilen über hight definieren möchte?

      1. Hi Dominik!

        Wieso wiederholst du die ganzen Informationen?

        Eine komplette Beispielseite ist nötig, um dir zu helfen. Entweder du postest deren Quellcode oder einen Link zu einer Seite, wo das Problem auftritt.

        MfG H☼psel

        --
        "It's amazing I won. I was running against peace, prosperity, and incumbency."
        George W. Bush speaking to Swedish Prime Minister unaware a live television camera was still rolling, June 14, 2001
        Selfcode: ie:% fl:( br:> va:) ls:& fo:) rl:? n4:& ss:| de:] js:| ch:? sh:( mo:) zu:)
        1. Entschuldige,

          wusste nicht, dass man den Quellcode posten kann.
          Das funktioniert also?
          Css.Datein hänge ich unten auch nochmal dran.

          <!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">
          <!--
          @import url("css Lateinamerika test.css");
          -->
          </style>
          </head>

          <body>
          <div align="center">
            <table width="840" height="560" border="0" cellpadding="0" cellspacing="0">
              <tr>
                <th rowspan="2" class="logofenster" scope="col">&nbsp;</th>
                <th height="45" colspan="9" class="Kastenoben" scope="col">&nbsp;</th>
              </tr>
              <tr>
                <th height="45" class="Abstandhalter" scope="col">&nbsp;</th>
                <th class="Linkfenster2" scope="col">&nbsp;</th>
                <th class="Abstandhalter" scope="col">&nbsp;</th>
                <th class="Linkfenster2" scope="col">&nbsp;</th>
                <th class="Abstandhalter" scope="col">&nbsp;</th>
                <th class="Linkfenster2" scope="col">&nbsp;</th>
                <th class="Abstandhalter" scope="col">&nbsp;</th>
                <th class="Linkfenster2" scope="col">&nbsp;</th>
                <th class="Abstandhalter" scope="col">&nbsp;</th>
              </tr>
              <tr>
                <th class="navileister" scope="row">&nbsp;</th>
                <td colspan="9" valign="top" class="TEXTLINIE"><p class="p">&nbsp;</p>
                </td>
              </tr>
            </table>
          </div>
          </body>
          </html>

          Css-Datei:

          .Kastenoben {
          line-height: 45px;
          text-align:center;
          background:#004287;
          font-size:100%;
          font-family:Arial, Helvetica, sans-serif;
          border-color:#FFFFFF;
          border-style:solid;
          border-width:0px 0px 1px 1px;
          }

          .Abstandhalter {
          line-height: 45px;
          width: 2px;
          background:#004287;
          border-color:#FFFFFF;
          border-style:solid;
          border-width:1px 1px 1px 1px;
          }

          .Abstandhalteraußen {
          line-height: 45px;
          width: 2px;
          background:#004287;
          border-color:#FFFFFF;
          border-style:solid;
          border-width:1px 0px 1px 1px;
          }

          .Linkfenster1 {
          line-height: 45px;
          width: 177px;
          background:#C5C5C5;
          text-align:center;
          font-size:100%;
          font-family:Arial, Helvetica, sans-serif;
          border-color:#FFFFFF;
          border-style:solid;
          border-width:1px 1px 1px 1px;
          }

          .Linkfenster2 {
          line-height: 45px;
          width: 178px;
          background:#C5C5C5;
          text-align:center;
          font-size:100%;
          font-family:Arial, Helvetica, sans-serif;
          border-color:#FFFFFF;
          border-style:solid;
          border-width:1px 1px 1px 1px;
          }

          .logofenster {
          line-height: 90px;
          width: 120px;
          text-align:center;
          border-color:#004287;
          border-style:solid;
          border-width:2px 0px 0px 2px;
          }

          .navileister {
          width: 120px;
          min-height: 450px;
          background:#004287;
          border-color:#FFFFFF;
          border-style:solid;
          border-width:1px 1px 0px 0px;
          }

          .TEXTLINIE {
          border-color:#004287;
          border-style:solid;
          border-width:0px 2px 2px 0px;
          }

          .p {
          color:#000000;
          font-family:Verdana,Arial,Helvetica,sans-serif;
          font-size:12px;
          margin-top:15px;
          margin-left:15px;
          margin-right:15px;
          font-weight:normal;
          text-align:justify;
          }