kostenloser Webspace werbefrei: lima-city


Text in einer Box mittig ausrichten

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    s*******l

    Hallo,
    ich habe ein Problem, das ich irgendwie nicht lösen kann.
    Ich habe diese Klasse definiert:


    .button {
    height:40px;
    width:120px;
    list-style-type:none;
    text-align:middle;
    }


    Wie bekomme ich jetzt aber den Text, der darin enthalten ist, genau in die Mitte, also nicht nur links und rechts gleich viel Platz, sondern auch oben und unten. Ich hoffe, ihr könnt mir helfen!

    mit freundlichen Grüßen

    starthtml



    Beitrag geaendert: 2.2.2007 14:14:35 von starthtml
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. Das geht ganz einfach, indem du die Klasse mit der Eigenschaft vertical-align erweiterst.

    text-align:middle; <-- Da muss übrigens 'center' statt 'middle' stehen: ;)
    text-align:center;

    Deine Klasse muss also so aussehen:

    .button {
    height:40px;
    width:120px;
    list-style-type:none;
    text-align:center;
    vertical-align:middle;
    }

    Siehe auch: http://de.selfhtml.org/css/eigenschaften/ausrichtung.htm#vertical_align
  4. Autor dieses Themas

    s*******l

    Geht nicht. Der Text wird nicht vertikal zentriert :(

    mit freundliche Grüßen

    starthtml
  5. Also ich weis auch nicht, bei mir funktionierts...

    Was benutzt du denn für einen Browser?
  6. Autor dieses Themas

    s*******l

    Ich habe Firefox. Aber im IE klappt es auch nicht. Hast du es denn auch mit Boxen ausprobiert oder mit Tabellen? Bei Tabellen geht das nämlich.

    mit freundliche Grüßen

    starthtml
  7. Normalerweise sollte der Text ja automatisch zentriert werden, zumindest wird er es bei mir...
    Sowohl FF als auch IE.

    Tut er es bei dir nicht? :confused:
  8. d*********2

    Vll hast du es falsch zugewiesen oder es wird nochmal überschrieben, denn

    .button {
    height:40px;
    width:120px;
    text-align:center;
    vertical-align:middle;
    }

    müsste funktionieren!!!

    Gruss
    DarkShadow
  9. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!