Aquariophile: vertical-align:bottom;

Hallo!

Mattes und ich versuchten das ja vorhn schon zu lösen,
bei dem vertical-align: middle; gab es einen workaround,
aber wenn ich es auf dem BOTTOM haben will geht es schon wieder nicht.

Also hier der HTML-Source _ohne_ workaround
(weil er fuer "bottom eh nicht geht)

<div style="width: 862px; height: 146px; position:absolute; left:0; top:50; text-align: right; vertical-align:bottom; background-color: #adbdce;">
Doofes<br>
neues<br>
HTML<br>
</div>

Der text sollte dem entsprechend am unteren Rand des DIV's sein,
und zwar rechts unten.

Eine Tabelle kann ich dafuer aus anderen Gründen nicht verwenden.

Wenn es sich vermeiden laesst soll die line-height auch nicht ewig hoch sein, weil mehr als nur eine zeile im unteren Rechten Eck sein soll.

Bitte versucht das mal wie das geht.

Ein Beispiel-Bild wie das aussehen soll sehr ihr hier:

<img src="http://wave.prohosting.com/aquario1/selfhtml.jpg" border="0" alt="">

DANKE!
Aquariophile

PS.: Es soll in HTML 4.01 strict (!!!) gehen

  1. Hallo,

    <div style="position:absolute;
                width:862px; height:146px;
                left:0;
                top:50;
                text-align:right;
                vertical-align:bottom;
                background-color: #adbdce;">

    <div style="position: absolute;
                  right:0px;
                  bottom:0px;">
        Doofes<br>
        neues<br>
        HTML<br>
      </div>
    </div>

    Viel Spaß weiterhin mit dem schönen neuen doofen HTML

    PS.: Es soll in HTML 4.01 strict (!!!) gehen

    Darum kümmree ich mich nie. Hauptsache es geht in möglichst vielen Browsern.

    Liebe Grüße aus http://www.braunschweig.de

    Tom

    --
    Intelligenz ist die Fähigkeit, aus Fehlern Anderer zu lernen und Mut die, eigene zu machen.
    1. geil geil geil geil geiiiiiiiiiiiiiiiil

      Lieber lieber Thomas,
      vielen vielen Dank für Deine tolle Hilfe das ist super!

      1. Hallo nochmals

        Sorry für meinen Freudenausbruch das geht doch ned.
        In Mozilla geht es,
        aber OPERA streikt.

        In Opera ist der Text oben.

        Und in Mozilla gibt es auch ein Problem,
        der scheint nicht zu kapieren dass er 50px abstand lassen soll zu oben.

        Bitte um Hilfe

        Aquariophile

        1. Na Hallo nochmal,

          dann probier das nochmal:

          <div style="position:absolute;
                      width:862px; height:146px;
                      spacing-top:50px;
                      left:0;
                      top:50;
                      text-align:right;
                      background-color: #adbdce;">

          <div style="position: absolute;
                        height:20px;
                        width:20px;
                        right:0px;
                        bottom:0px;">
              Doofes<br>
              neues<br>
              HTML<br>
            </div>
          </div>

          Liebe Grüße aus http://www.braunschweig.de

          Tom

          --
          Intelligenz ist die Fähigkeit, aus Fehlern Anderer zu lernen und Mut die, eigene zu machen.
          1. Hallo Thomas

            Wir machen schon Fortschritte :)

            +---------------------------------+
            |                                 |
            |                                 |
            |                                 |
            |                                 |
            |                                 |
            |                               Doofes
            +---------------------------------+
                                            neues
                                            HTML

            LG,
            Aquariophile

            1. Hi @ all,

              kann mir jemand erklären, wei man den Abstand von der Tabelle zum Rand weg bekommt?

              <div style="width:862px; height:146px;
                          margin-top:50px;
                          margin-left:50px;
                          padding:0px;
                          spacing:0px;
                          background-color: #adbdce;
                          text-align:right;
                          vertical-align:bottom;
                          border-width:3px;
                          border-style:solid;
                          border-color:red;">

              <table style="height:100%;
                                padding:0px;
                                border-spacing:0px;
                                margin:0px; border:0px;" >
                  <tr>
                    <td style="vertical-align:bottom;
                               padding:0px;
                               border-spacing:0px;
                               margin:0px;
                               border-collapse:collapse;
                               border-width:0px;
                               background-color:#559955">Doofes  neues  HTML</td>
                  </tr>
                  </table>

              </div>

              Diese ganzen Browswer sind Kinderkakke!

              Die sind bestimmt von den Kindern der Ausserirdischen geschrieben, die uns die Computer gebracht haben.

              Liebe Grüße aus http://www.braunschweig.de

              Tom

              --
              Intelligenz ist die Fähigkeit, aus Fehlern Anderer zu lernen und Mut die, eigene zu machen.
          2. Und noch einer:

            <div style="position:absolute;
                        width:862px; height:146px;
            /*            spacing-top:50px; */
                        left:0;
                        top:50;
                        text-align:right;
                        vertical-align:bottom;
                        background-color: #adbdce;">

            <div style="position: absolute;
                          height:60px;                    /*opera streckt das Div nicht*/
                          width:60px;
                          right:0px;
                          bottom:0px;
                          background-color: #ccccFF;">

            Doofes<br>
                neues<br>
                HTML<br>
              </div>
            </div>

            <!-- Opera streckt das DIV nicht, wenn der Text größer wird, richtet den Text aber
                 nach der pberen linken Ecke aus, wenn nichts anderes gesagt wird.
                 MSIE richtet den text immer an der oberen linken Ecke aus, streckt aber das DIV,
                 wenn der Text mehr Platz benötigt. Wenn man das nicht will, muss man
                 overflow:hidden; verwenden -->

            Der funktioniert jetzt in Netscape 7, Opera, Mozilla und IE5.5

            Liebe Grüße aus http://www.braunschweig.de

            Tom

            --
            Intelligenz ist die Fähigkeit, aus Fehlern Anderer zu lernen und Mut die, eigene zu machen.
            1. huhu

              ok also das geht!

              Nur es ist mir ein Raetsel wie ich denn bei jedem Text den ich da verfasse genau wissen soll wie hoch
               (ok höhe geht ja noch wegen der "line-height")
              und wie breit also lang (und das ist das Problem) der Text grad ist.

              Weil wenn der über den <DIV> rauswaechst isses mies der text muss schon drinbleiben.

              Und die Schriften varieren doch etwas von Browser zu Browser.