Peter Thomassen: Element mit der Höhe 100% - 34px

Hallo Forum,
ist es möglich, einem Element die Höhe 100% - 34px zu geben? Es
einfach so zu notieren funktioniert nicht ...

Danke,
Peter

  1. Hallo Forum,

    Wir sind Forum.
    Sie werden assimiliert.

    Hi, Peter

    ist es möglich, einem Element die Höhe 100% - 34px zu geben? Es
    einfach so zu notieren funktioniert nicht ...

    Vielleicht hilft dir das:

    top:0px;
    bottom:34px;

    Opera benötigt dann jedoch noch eine Angabe von "height:", da er sonst die bottom-Angabe nicht berücksichtigt.

    LG Orlando

    1. Hi,

      Vielleicht hilft dir das:

      top:0px;
      bottom:34px;

      Nö, hilft nicht. Ihr könnt euch ja mal http://cw.dns2go.info/ angu-
      cken, da versuche ich gerade, mein Tabellenlayout in ein Layerlayout
      umzuwandeln. Es wäre dann noch interessant, warum der IE die Leiste
      unten einen Pixel nach oben schiebt, und Mozilla unten als Abstand
      den padding dazurechnet (margin wird also als padding gesetzt).

      Danke,
      Peter

      1. Hi, Peter

        top:0px;
        bottom:34px;

        Nö, hilft nicht. Ihr könnt euch ja mal http://cw.dns2go.info/ angucken

        Oops, Opera zeigt ja hier beinahe gar nichts an, weil für die Klasse "center small" keine Höhe definiert ist. Hier gehört unbedingt noch height: hinein -> </?m=59706&t=10783>

        LG Orlando

        1. Hi,

          top:0px;
          bottom:34px;

          Nö, hilft nicht. Ihr könnt euch ja mal http://cw.dns2go.info/ angucken

          Oops, Opera zeigt ja hier beinahe gar nichts an, weil für die Klasse "center small" keine Höhe definiert ist. Hier gehört unbedingt noch height: hinein -> </?m=59706&t=10783>

          Dann hat Mozilla noch mehr Mist gemacht (der Abstand unten bekam
          die Hintergrundfarbe). Trotzdem wüsste ich jetzt gerne, wieso

          • Mozilla bei padding wie margin anwendet
          • IE unten bei der Leiste einen Pixel freilässt

          und wie

          • man eine Höhe von 100%-34px erzeugt.

          Danke,
          Peter

          1. Moin!

            und wie

            • man eine Höhe von 100%-34px erzeugt.

            Natürlich hängt es davon ab, was du konkret wirklich willst (nach dem Gejammer der Opera-Fraktion hab ich den Link nicht besucht).

            Konkret: height bezieht sich auf den dem Inhalt zur Verfügung stehenden Teil. Drumherum ist padding (in der background-Formatierung), border (eigene Formatierung) und margin (immer transparent).

            Dein Fall ließe sich also möglicherweise mit "height: 100%; margin-bottom:34px;" lösen (wahlweise auch margin-top). Dann hast du unten die definierte Breite an Rand, der Layer wird aber trotzdem so groß gemacht, wie es geht (100% eben).

            Ich habe bei prozentualen Höhenangaben aber immer die Bedenken, daß der Browser zu einer anderen Überzeugung kommt als du, von welchem Wert aus die 100% zu berechnen sind. Die Höhe des Browserfensters ist es jedenfalls nicht, oder nur sehr selten, sondern es sind die umschließenden Elemente des <div>, im Zweifel <body> und <html>. Und die passen sich bekanntlich der Seitenlänge automatisch an.

            - Sven Rautenberg

            1. Hi,

              Konkret: height bezieht sich auf den dem Inhalt zur Verfügung stehenden Teil. Drumherum ist padding (in der background-Formatierung), border (eigene Formatierung) und margin (immer transparent).

              So sollte es sein, ja. Mozilla verrechnet sich dabei aber.

              Dein Fall ließe sich also möglicherweise mit "height: 100%; margin-bottom:34px;" lösen (wahlweise auch margin-top). Dann hast du unten die definierte Breite an Rand, der Layer wird aber trotzdem so groß gemacht, wie es geht (100% eben).

              html und body sind bei auf 100%. Da ist ein div drin, der auch 100%
              und ein unten ausgerichtetes Hintergrundbild hat. Das Hintergrund-
              bild soll 34px vor dem Ende der Seite aufhören.

              Bye,
              Peter

      2. hi

        Nö, hilft nicht. Ihr könnt euch ja mal http://cw.dns2go.info/ angu-
        cken, da versuche ich gerade, mein Tabellenlayout in ein Layerlayout
        umzuwandeln. Es wäre dann noch interessant, warum der IE die Leiste
        unten einen Pixel nach oben schiebt, und Mozilla unten als Abstand
        den padding dazurechnet (margin wird also als padding gesetzt).

        hä?!? kannst du mal deutlicher machen, was du meinst?

        Das einzige, was mir auffällt ist, dass die Seite ein sehr großes Fenster braucht und noch nichteinmal zur Seite scrollt, dafür links aber einen riesigen grauen Bereich hat!

        Grüße aus Bleckede

        Kai

        1. Hi,

          hä?!? kannst du mal deutlicher machen, was du meinst?

          Ich bastle gerade wieder dran rum, sorry.

          Bye,
          Peter

  2. Hallo Peter,
    wo soll eigentlich der Sinn Deines Unterfangens sein???
    Ich bemaße entweder relativ, also in Prozent o d e r genau, also in Pixel - das häng vom Layout ab. Natürlich kann man das auf einer Seite auch mischen, aber in e i n e m Element?

    1. Hi,

      wo soll eigentlich der Sinn Deines Unterfangens sein???
      Ich bemaße entweder relativ, also in Prozent o d e r genau, also in Pixel - das häng vom Layout ab. Natürlich kann man das auf einer Seite auch mischen, aber in e i n e m Element?

      Ich ein div mit 100% Höhe, möchte aber, dass sein Hintergrundbild
      34px über dem Bildschirmrand aufhört.

      Bye,
      Peter

      1. Ich ein div mit 100% Höhe, möchte aber, dass sein Hintergrundbild
        34px über dem Bildschirmrand aufhört.

        nach meinen Erfahrungen mit Div funktioniert nur die Methode 'position:absolute' zuverlässig und die misst von oben links.
        Ich würde es also nicht mit Div machen Punkt.
        Nimm eine Tabelle, zwei Zeilen, die untere 34px hoch, und leg in die obere Zelle Dein Bild.

        1. Hi,

          Nimm eine Tabelle, zwei Zeilen, die untere 34px hoch, und leg in die obere Zelle Dein Bild.

          Na genau das will ich ja umgehen.

          Bye,
          Peter

          1. Hi,

            Nimm eine Tabelle, zwei Zeilen, die untere 34px hoch, und leg in die obere Zelle Dein Bild.

            Na genau das will ich ja umgehen.

            warum? auch dem anti-Tabellen-Wahn verfallen?

            1. Hi,

              Na genau das will ich ja umgehen.

              warum? auch dem anti-Tabellen-Wahn verfallen?

              Genau. Vor allem, weil der Code nachher übersichtlicher ist (Para-
              debeispiel: http://mozilla.linuxfaqs.de/).

              Bye,
              Peter

              1. warum? auch dem anti-Tabellen-Wahn verfallen?

                Genau. Vor allem, weil der Code nachher übersichtlicher ist (Para-
                debeispiel: http://mozilla.linuxfaqs.de/).

                stimmt, sieht übersichtlich aus!

              2. hi

                Genau. Vor allem, weil der Code nachher übersichtlicher ist (Para-
                debeispiel: http://mozilla.linuxfaqs.de/).

                danke für das Lob ;)
                ..funzt aber nur gut, wenn man in der CSS-Datei entsprechend komplexe Konstrukte zusammenzimmert und vor allem keinen Wert darauf legt, dass es überall auf den Pixel gleich aussieht... Schonmal bei 4 Browserherstellern zugleich gemeckert? (bei M$ bringt's ja nix, könnte man aber auch schön)

                Grüße aus Bleckede

                Kai

        2. hi

          nach meinen Erfahrungen mit Div funktioniert nur die Methode 'position:absolute' zuverlässig und die misst von oben links.

          ein beliebter Fehler!
          ein absolut positioniertes <div> kann von jeder Ecke her ausgerichtet werden. Neben left: und top: gibt's nämlich auch right: und bottom:. Mit top:0px;bottom:34px;height:auto; oder so *sollte* es klappen.

          Grüße aus Bleckede

          Kai

          1. hi

            nach meinen Erfahrungen mit Div funktioniert nur die Methode 'position:absolute' zuverlässig und die misst von oben links.

            ein beliebter Fehler!
            ein absolut positioniertes <div> kann von jeder Ecke her ausgerichtet werden. Neben left: und top: gibt's nämlich auch right: und bottom:. Mit top:0px;bottom:34px;height:auto; oder so *sollte* es klappen.

            "sollte"...

            1. Hi,

              ein beliebter Fehler!
              ein absolut positioniertes <div> kann von jeder Ecke her ausgerichtet werden. Neben left: und top: gibt's nämlich auch right: und bottom:. Mit top:0px;bottom:34px;height:auto; oder so *sollte* es klappen.

              "sollte"...

              Tut es auch, ich vergaß, height von 100% auf auto zu ändern.

              Bye,
              Peter

              1. ein beliebter Fehler!
                ein absolut positioniertes <div> kann von jeder Ecke her ausgerichtet werden. Neben left: und top: gibt's nämlich auch right: und bottom:. Mit top:0px;bottom:34px;height:auto; oder so *sollte* es klappen.

                "sollte"...

                Tut es auch, ich vergaß, height von 100% auf auto zu ändern.

                na, das probiere ich auch aus.  In welchen Browsern/Plattformen hast Du es geteste?