XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   Text horizontal zentrieren (http://xhtmlforum.de/showthread.php?t=69747)

Vittel 23.07.2013 14:41

Text horizontal zentrieren
 
Hallo zusammen,
ich habe folgenden HTML Code als Footer:
<div style="background-color:#696969;width:93%;
height:30px;" align="center">Adresse Adresse Adresse</div>

Das ganze sieht auch ganz gut aus, jedoch hängt mir der Text zu sehr oben an dem grauen Balken.
Lässt sich dass irgendwie regeln, dass es zentriert ist.

Danke und Grüße
:D

gaby 23.07.2013 16:08

Zitat:

Zitat von Vittel (Beitrag 531605)
ich habe folgenden HTML Code als Footer:
<div style="background-color:#696969;width:93%;
height:30px;" align="center">Adresse Adresse Adresse</div>

Das ganze sieht auch ganz gut aus, jedoch hängt mir der Text zu sehr oben an dem grauen Balken.
Lässt sich dass irgendwie regeln, dass es zentriert ist.

Hallo,

Wenn dein Text sehr kurz ist, und auch bei schmalem viewport noch in eine Zeile passt, kannst du zusätzlich zu 'height' noch 'line-height' mit dem gleichen Wert deklarieren.

Allerdings würde ich nicht 'px', sondern 'em' verwenden.
Mit der Schrifteinheit 'px' wird dein Text nicht mehr vertikal zentriert sein, wenn sich ein Besucher deiner Site die Schriftgröße verstellt.

so in etwa:

Code:

<div style="background-color:#696969;
    height:2.5em;  line-height: 2.5em;
    width:93%;  margin: auto;
    text-align: center;">
      Adresse Adresse Adresse
</div>

Die Inline-Styles sollten eigentlich in ein externes Stylesheet. ;)

Grüße
gaby

Vittel 23.07.2013 16:36

Hallo Gaby,
vielen Dank hat einwandfrei funktioniert. :)
Liebe Grüße

vanDerb 23.07.2013 18:20

Ausserdem align="center" durch style="text-align: center" ersetzen, da das align-Attribut für divs bereits in HTML4 deprecated und in HTML5 erst nicht mehr unterstützt wird.


Alle Zeitangaben in WEZ +2. Es ist jetzt 02:44 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023