Center ein H2 innerhalb eines div-Elements

Ich wollen Mitte h2 in #top aber vertical-align:middle funktioniert nicht... ich habe keine Ahnung, was zu tun ist!

#top {
    display: block;
    position: relative;
    height: 100px;
    background-color: rgba(89,144,222,.6);
}
#top h2{
    text-shadow: 2px 2px black;
    text-align: center;
    color: white;
    font-family:"Impact";
    font-size: 50px;
}

Effekt - http://puu.sh/2mz5M

  • Es ist nichts falsch mit der CSS, und ist wahrscheinlich etwas falsch mit dem HTML Ihrer Verwendung. Der Nachweis dieser arbeiten können gefunden werden jsfiddle.net/GbGGQ weitere dieser mehr ideal auf Stack Overflow aber mehr als wahrscheinlich ein Duplikat.
  • Ihre Frage ist nicht klar: wollen Sie zentrieren es horizontal oder vertikal oder beides? Sie haben text-align: center; aber erwähnen, "vert-aliignt Mitte"... bitte klären. Außerdem teilen Sie den HTML helfen würde – CSS korrekt sein kann, HTML falsch sein könnte, etc.
InformationsquelleAutor Filip Bartuzi | 2013-03-23
  1. 5

    Ich sehe, Sie haben die Höhe festgelegt, für div, das ist toll, für diese situation. Sie können dies tun:

    #top h2{
    text-shadow: 2px 2px black;
    text-align: center;
    color: white;
    font-family:"Impact";
    font-size: 50px;
    line-height: 100px;
}
    InformationsquelleAutor ceruleus
  2. 0

    Sollte es funktionieren wenn du die line-height des div. Finden Sie unter Methode 2 hier:

    http://phrogz.net/css/vertical-align/index.html

    InformationsquelleAutor ftpaul
  3. 0

    Geben eine Feste Höhe und line-height zu vertikal-align und text-align: center zentriert den text.

    #top {
    position: relative;
    height: 100px;
    line-height: 100px;
    background-color: rgba(89,144,222,.6);
}

    #top h2{
        text-shadow: 2px 2px black;
        text-align: center;
        color: white;
        font-family:"Impact";
        font-size: 50px;
    }

    Jsfiddle : http://jsfiddle.net/XvFCT/

    InformationsquelleAutor Avin Varghese
Schreibe einen Kommentar