Höhe eines Layers im IE

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

  • Höhe eines Layers im IE

    Hallo zusammen,
    ich habe ein Problem mit der Darstellung von div-Layern im IE. Im Mozilla sieht es so aus, wie ich es haben möchte. Im Mozilla wird die Angabe "height:80px" beachtet. Der IE zieht die Höhe entsprechend des innenliegenden Bildes auf. Was muss ich ändern?

    Die Seite ist hier:
    http://blog.schuemann.net

    Die CSS-Daten:

    #container {
    border: 2px solid #cccccc;
    width: 760px;
    margin:0px auto;
    padding: 5px;
    padding-top: 10px;
    text-align:left;
    background-color: #ffffff;
    }

    .border {
    height: 100%;
    padding: 5px;
    border: 2px solid #cccccc;
    background-color: #ffffff;
    }

    #header {
    width: 740px;
    margin:0px auto;
    margin-top: 5px;
    padding: 5px;
    padding-top: 10px;
    background-color: #ffffff;
    border: 1px dashed #cccccc;
    height: 80px;
    max-height: 80px;
    }

    #contents {
    width: 470px;
    height: 100%;
    float: left;
    padding-top: 30px;
    padding-left: 10px;
    }

    #title {
    font-size: 21px;
    font-weight: bold;
    text-align: left;
    vertical-align: bottom;
    color: #4d0000;
    padding-left: 5px;
    float: left;
    }

    #search {
    font-size: 10px;
    font-weight: normal;
    text-align: left;
    vertical-align: top;
    float: left;
    }

    #about {
    text-align: right;
    float: right;
    padding-right: 5px;
    height: 80px;
    max-height: 80px;
    }


    Danke für Eure Hilfe!

  • #2
    Ich denke, dass es eher max-height ist, was der Firefox korrekt anzeigt und der IE bekanntlich nicht korrekt beherrscht.

    Wie wäre es mit einer absoluten Positionierung innerhalb des container-Elements. Das wiederrum müsste dann auch absolut Positioniert werden.

    Kommentar


    • #3
      Danke für Deinen Hinweis, aber absolut positionieren geht meines Wissens nicht, da ich ja zentriert darstelle. Oder liege ich da falsch?

      Gruß
      Detlev

      Kommentar


      • #4
        Abraxax (Schande über mein Haupt, wenn ich da falsch liege) postet immer gerne mal wieder ein Codeschnipsel, der auch eine zentrierung über absolute Positionierung ermöglicht.

        Ihc selbst habe das hier angewandt.

        Nochmal zur Erklärung:

        Code:
        .container {
           position:absolute;
           left:50%;
           top:20px;
           margin-left:-400px;
           width:800px;
        }
        Man positioniert das Element also horizontal auf 50% und nimmt als außenabstand einen negativen Wert der der Hälfte der Breite des Elementes entspricht, und schon ist das absolut positionierte Element zentriert. =)

        Kommentar


        • #5
          Original geschrieben von dschue
          aber absolut positionieren geht meines Wissens nicht, da ich ja zentriert darstelle.
          das liegt nur an deinem "wissen", dass du das denkst.
          absolute positionierung verhält sich bekanntlich relativ in bezug auf das jenige elternelement, dessen position vom default-wert static abweicht.


          aber ich wüsste nicht, warum es hier absolute positionierung brauchen sollte. wenn du willst, dass ein element mit height:80px auch 80px hoch bleibt, wenn der inhalt selbst "grösser" wird, arbeite mit overflow:hidden.
          I don't believe in rebirth. Actually, I never did in my whole lives.

          Kommentar


          • #6
            Original geschrieben von Happy Nihilist
            und schon ist das absolut positionierte Element zentriert. =)
            die methode ist extrem unschön, weil bei zu kleinem browserfenster (und 800px sind nun mal nicht eine breite, die man ohne weiteres voraussetzen kann) das element so weit links positioniert wird, dass es unter dem linken rand des viewports verschwindet - ohne dass du einen scrollbalken bekommen würdest.
            I don't believe in rebirth. Actually, I never did in my whole lives.

            Kommentar


            • #7
              Leider wird aber bei "overflow:hidden" das Bild abgeschnitten. Das will ich ja aber nicht. Es soll halt so aussehen, wie es jetzt im Mozilla dargestellt wird.


              Original geschrieben von wahsaga
              das liegt nur an deinem "wissen", dass du das denkst.
              absolute positionierung verhält sich bekanntlich relativ in bezug auf das jenige elternelement, dessen position vom default-wert static abweicht.


              aber ich wüsste nicht, warum es hier absolute positionierung brauchen sollte. wenn du willst, dass ein element mit height:80px auch 80px hoch bleibt, wenn der inhalt selbst "grösser" wird, arbeite mit overflow:hidden.

              Kommentar


              • #8
                Original geschrieben von wahsaga
                aber ich wüsste nicht, warum es hier absolute positionierung brauchen sollte. wenn du willst, dass ein element mit height:80px auch 80px hoch bleibt, wenn der inhalt selbst "grösser" wird, arbeite mit overflow:hidden.
                Aber er will ja, dass das Bild angezeigt wird, welches sich in diesem Elemnt befindet, welches ungewollterweise gestreckt wird. Mit hidden würde es ja abgeschnitten werden. Korrekterweise.

                Original geschrieben von wahsaga
                die methode ist extrem unschön, weil bei zu kleinem browserfenster (und 800px sind nun mal nicht eine breite, die man ohne weiteres voraussetzen kann) das element so weit links positioniert wird, dass es unter dem linken rand des viewports verschwindet - ohne dass du einen scrollbalken bekommen würdest.
                Stimmt, nicht bedacht.

                Kommentar

                Lädt...
                X