CSS-Layout-Problem

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • CSS-Layout-Problem

    Moin Leute,

    ich habe folgendes Problem, malwieder den IE betreffend.

    Schaut euch folgende Seite mal mit Firefox und dann mit IE an. Im Firefox schauts fast so aus, wie es sein soll, im IE is es wie üblich irgendwie vermurkst, und ich kapiere nicht warum. :>

    Link zum Design

    Problem im Firefox ist, dass die Links oben angeklatscht werden in der Navi-Leiste. Ich dachte eigentlich das würde sich durch ein

    PHP-Code:
    displayblock;
    floatleft
    erledigen, tut es aber aus mit unerklärlichen Gründen leider nicht. :>

    Hier die Links zu den CSS-Files:
    Rahmen
    HTML
    Links
    Klassen

    Achja, für den Head-Bereich und die Mitte habe ich bewusst relative Breitenangaben gewählt, damit sich das Design beim minimieren des Fensters, bzw. bei kleineren/größeren Auflösungen anpassen kann.

    Ein anderes Problem im IE ist die Sache mit dem <legend> irgendwie is da über dem Rahmen der Felder noch ein weißer Balken. Sehr merkwürdig. :>

    Das größte Problem im IE is aber das Navi-Menu, wie man sieht. Ich kapiers nicht. ^^

    Vielen Dank schoneinmal für die Hilfe. Ich hab mich bisher im Zusammenhang mit CSS nur mit der Seite von Peter auseinandergesetzt, dort konnte ich aber keine direkten Lösungen für mein Problem finden. Auch wollt ich den armen Kerl nich schon wieder per eMail belästigen, darum dachte ich mir ich poste mal hier.

    Greetz,
    Nohfreak
    Mein aktuelles Projekt: Hausaufgaben Datenbank für kostenlose Hausaufgaben

  • #2
    1. setze eine doctype
    2. informier dich über darstellungsmodi
    3. informier dich über das box-modell und den bug, den der ie hat

    gruß
    peter
    Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
    Meine Seite

    Kommentar


    • #3
      Und doch mal wieder der Peter. Danke dir erstmal!

      Also, ich hab als Doctype nun XHTML Transitional angegeben, dann das ganze durch den W3C-Validator gejagdt und dann die Fehler alle behoben.

      Dann hab ich .mainnavi li das Attribut display: inline; zugefügt, nun sind die Links auch in unserem guten Freund IE6 wieder in einer Reihe.

      In deinem ersten Tutorial zu CSS habe ich allerdings gelesen, dass das Anklatschen der Links nach oben mit

      display: block;
      float: left;

      zu beheben sei. Das hab ich dann eingefügt, aber leider sind die Links immernoch nach oben angeklatscht.

      .mainnavi a
      {
      color: #FFFFFF;
      font-weight: bold;
      text-decoration: none;
      height: 22px;
      display: block;
      float: left;
      padding: 0px 10px 0px 10px;
      }
      Ich könnte natürlcih einfach nach oben hin ein Padding oder ein Margin reinpacken, aber leider verschiebt sich dann auch das Hintergrundbild beim Hover mit nach unten.

      Haste da evtl. noch nen heißen Tip ?

      Und das <legend> scheint der IE6 einfach nich zu kapieren, oder ? In Opera und Firefox funktioniert das nämlich astrein.

      Greetz,
      Nohfreak
      Mein aktuelles Projekt: Hausaufgaben Datenbank für kostenlose Hausaufgaben

      Kommentar


      • #4
        height: 22px; raus und mit padding arbeiten

        gruß
        peter
        Nukular, das Wort ist N-u-k-u-l-a-r (Homer Simpson)
        Meine Seite

        Kommentar


        • #5
          Ah, supi, damit hats nun funktioniert, danke. Damit wären die größten Probleme nun schonmal aus der Welt.

          Für die Sache mit dem Legend habe ich auch ne Lösung gefunden, vielleicht kann damit ja mal irgendwer was anfangen, der den Thread hier liest, oder Peter kann das in seine Liste mit den IE6-Bugs aufnehmen.

          *html fieldset
          {
          position: relative;
          padding: 10px;
          }

          *html legend
          {
          position: absolute; top: -.5em; left: .5em;
          }
          Mein aktuelles Projekt: Hausaufgaben Datenbank für kostenlose Hausaufgaben

          Kommentar

          Lädt...
          X