Textausrichtung außerhalb von Tabellen

wulvpak

Hallo Leute,

wie kann ich einen Text mittig ausrichten ohne ihn mit "vertical-align:middle" zu deklarieren??
Ich schreibe gerade eine CSS-Datei und möchte in einem Menü die einzelnen Menüpunkte vertikal-mittig ausgerichtet haben!!
Leider nehmen die "div's" den Befehle komplett nicht an!!

Danke für eure Hilfe

Grüße

zwutz

text-align:center;

Google unso

zwutz schrieb:

text-align:center;

Dieser Befehl hat mit einer vertikalen Ausrichtung so ziemlich überhaupt nichts zu tun

Allgemein gilt: Es heißt nicht umsonst text-align. Jegliche text-align oder vertical-align-Werte wirken an sich nur auf Inline-Elemente, nicht jedoch auf Block-Elemente. Du kannst dein <div> nun als inline deklarieren (wobei aber einige Browser - Favorit: IE - Probleme machen könnten, da bin ich mir gerade nicht sicher). Alternativ könntest du mit margins arbeiten, aber die sind bei weitem nicht dynamisch genug.

darthdespotism

<div> s horizontal / vertikal auszurichten geht eingetlich doch ganz angenehm mit den entsprechenden argin: auto werten?

Horizontal ja, vertikal leider nein ...

wulvpak

Danke für eure Hilfe!

Ich habe es nun doch mit einer netten und eleganten Tabelle gemacht.
Es ist leider so, dass ich weiterhin keine Möglichkeit gefunden habe einen Text außerhalb von Tabellen vertikal-mittig auszurichten!!!
Es ist trotzdem eine nette Lösung und mein Ziel war es, mich mit dem Problem zu befassen und nicht das Ergebnis selbst!!

Seht selbst:

Teil meiner CSS-Datei!!

table#menu
{
position:absolute;
top:90px;
left:1px;
z-index:2;
font-weight:bold;
font-size:9pt;
font-family:Arial;
text-align:center;
background-color:rgb(210,210,210);
}
td#menu
{
width:92px;
height:28px;
z-index:3;
}

Teil meiner HTML-Datei!!

Tschau und Danke nochmal!!!!

zwutz

wulvpak schrieb:

Ich habe es nun doch mit einer netten und eleganten Tabelle gemacht.

seit wann sind Tabellen elegant?

ein Menü sollte so aussehen

<ul id="menu">
<li>Punkt 1</li>
<li>Punkt 2</li>
<li>Punkt 3</li>
</ul>

ohne div, ohne Tabelle. Eine ul reicht vollkommen

So.. und warum willst du ein Menü vertikal zentriert anzeigen?

Ich glaub, die Frage könnt ich mir sparen, wenn ich wüsste, wie du dir dein Layout vorstellst und was du bisher hast.
Ich glaub einfach, dass du bisher die falsche Vorstellung vom Webdesign hast (ich war noch nie in der Situation, dass ich Text, geschweige denn ein Menü vertikal zentrieren wollte oder musste)

Ach und noch was: eine ID muss (nicht sollte) einmal sein.

wulvpak

Entschuldige großer Meister!!!

Aber wie ich bereits erwähnt habe, geht es mir nicht um das Ziel!!!!!!!!!!!
Sondern darum alles mal ausprobiert zu haben!!!!!!!!!!!
Und wenn ich einzelne Menüpunkte selbst in CSS gestalten möchte und in diesen Elementen einen Text haben möchte der nicht nur horizontal in der Mitte steht sondern auch vertikal dann brauche ich auch (vertical-align:middle;)!!!

Ich bedanke mich trotzdem bei dir für deine überaus gute und vollständige Hilfe, die mir im übrigen "sehr" weiter geholfen hat!

Dankeschön und nette Grüße

MORL

Versuch mal folgendes:

<style type="tex/css">
  div.vertical-aligned {
    height: 50px;
    line-height: 50px;
    vertical-align: middle;
  }
</style>
<div class="vertical-aligned">
  Testtext
</div>

vertica-align bezieht sich nämlich auf eine Zeile Text und nicht auf eine Box. Das Vergrößern der Zeilenhöhe gibt uns in diesem Fall die Möglichkeit den Text mittig zu plaziere. In wie weit das aber in allen Browsern funktioniert kann ich dir jetzt nicht sagen.

UNd ich muss zwutz recht geben. Tabellen sind auf keinen Fall elegant wenn sie für etwas anderes als tabellarisch darzustellende Inhalte verwendet werden. Um einen gewünschten optischen Effekt zu erzielen muss man mit unter etwas mehr Zeit zubringen und manchmal ist es auch gar nicht möglich. In solchen Fällen sollte man sich dann fragen oder der Weg den man geht tatsächlich der richtige ist ;).

wulvpak

Hallooo,

ja das stimmt allerdings, Tabellen sind Null elegant!!!!
Ich habe den letzten Weg probiert und auf eine Liste (ul) angewendet!!
Ich muss dazu sagen, dass ich die Liste horizontal ausgerichtet habe und jetzt möchte ich den Text mittig haben!!!
Die einzelnen "Menüpunkte" sind fette Buttons die verlinkt sind!!
klappt alles super, möchte nur noch die Schrift mittig setzen!!!
Wenn ihr mir dabei noch behilflich sein könntet wär ich nochmals dankbar!!

PS.: Meine letzte Nachricht war nicht böse gemeint, falls das so rüber kam!!

Tschau und danke für eure Hilfe