ash: div tags

Hallo,
wie kann ich in einem div-tag den Text vertikal mittig ausrichten?
vertical-align: middle;
hat keinen Erfolg gebracht.
danke,
_ash

  1. Hallo ash!

    vertical-align: middle; hat keinen Erfolg gebracht.

    Wie wäre es, wenn Du etwas näherliegendes verwenden würdest...?

    Schönen Gruß

    Afra

    1. hi Afra,

      weil sich das nur auf die horizontale Ausrichtung bezieht, ich möchte den Text aber vertikal ausrichten.

      mfg
      _ash

      1. Hallo ash!

        Sorry, ich hab gepennt. ;o)

        Schönen Gruß

        Afra

    2. Hello out there!

      Wie wäre es, wenn Du etwas näherliegendes verwenden würdest...?

      Wie soll das bei _vertikaler_ (das ist die Richtung oben–unten)  Ausrichtung helfen? Du hattest doch nicht etwa die Änderung der Leserichtung im Sinn?

      See ya up the road,
      Gunnar

      --
      “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
      1. Hallo Gunnar!

        Wie soll das bei _vertikaler_ (das ist die Richtung oben–unten)  Ausrichtung helfen? Du hattest doch nicht etwa die Änderung der Leserichtung im Sinn?

        Ich hab gerade wie der Pavlovsche Hund losgelegt. Irgendwie habe ich das vertikal nicht gelesen. Das ist bei mir wie mit rechts und links. Ich muss immer nachdenken, das geht nicht automatisch. Sorry für die Fehlinformation.

        Schönen Gruß

        Afra

  2. Hello out there!

    wie kann ich in einem div-tag den Text vertikal mittig ausrichten?
    vertical-align: middle;
    hat keinen Erfolg gebracht.

    Was du in der Spec [CSS2 §10.8] nachlesen kannst.

    See ya up the road,
    Gunnar

    --
    “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
  3. Hi,

    wie kann ich in einem div-tag den Text vertikal mittig ausrichten?

    Leider eine Lücke beim derzeit per Css Machbaren: es gibt für IE schlicht keine Möglichkeit, da der display:table-cell nicht kennt. vertical-align bezieht sich auf die aktuelle Zeilenhöhe, nicht aber auf eine "box" - wie auch immer Du Dir diese bastelst. Lediglich innerhal einer td lässt sich vertical-align auch beim IE in der von Dir gewünschten Form anwenden.

    Ich habe mal einen workaround gebastelt der Deinem Vorhaben vielleicht entgegenkommt. Die Box wird hier mittels h-tag erzeugt. Andere Höhen müssen für IE in den Conditionals auch beim font-size angegeben werden. Ist aber nur ein Test:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
            "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
    <html>
    <head>

    <title>vertical centered</title>

    <style type="text/css">

    body{
            margin: 0;
            padding: 20px;
            font-family: sans-serif;
        }

    h1 {
            width: 250px;
            height: 200px;
         padding: 0;
         margin: 0;
            display: table-cell;
            vertical-align: middle;
            text-align: center;
            border: 1px solid red;
        }

    a.aligned {
            width: 250px;
            font-size: 18px;
            line-height: 20px;
            display: table-cell;
            vertical-align: middle;
            text-decoration: none;
            color: black;
        }

    h1 a.aligned span {
            font-weight: normal;
            font-size: 11px;
        }

    </style>

    <!--[if lte IE 6]>
    <style>

    h1 {
            margin:0;
            padding:0;
            height:200px;
            font-size:165px;
        }

    h1 a.aligned {
            font-size:18px;
            line-height:100%;
            vertical-align:middle;
            display:inline-block;
        }

    </style>
    <![endif]-->

    </head>
    <body>

    <h1><a class="aligned" href="#">Dieser Text <br><span>[wird zentriert]</span></a></h1>

    </body>
    </html>

    Gruesse, Joachim

    --
    Am Ende wird alles gut.