Probleme mit ausrichtung vertical

[TomIRL]

Hallo und guten Tag,
Hm ich glaube ich habe da einen Denkfehler bei mir gemacht:
folgender Quelltext arbeitet mit nachfolgender css zusammen:
das einzieg was nicht richtig funktioniert ist vertical-align:
Und zwar möchte ich, dass der Text mittig in der Box zentriert ist.
Hab ich da einen grundsätzlichen Denkfehler drin oder worin liegt das Problem?

<div class="obj_artikel">
  <!--Bilderrahmen-->
  <div class="img_border">Test1 </div>
  <!--Bereich Beschreibung-->
  <div class="artikel">  </div>
</div>

.obj_artikel{
  position:relative;
  top:0px;
  left:0px;
  width:600px;
  height:170px;
  border-color:#252d51;
  border-width:1px;
  border-style:solid;
  vertical-align:middle;
  text-align:center;
  margin-bottom:20px;
  }

.img_border{
  position:absolute;
  top:0px;
  left:0px;
  width:130px;
  height:130px;
  border-color:#252d51;
  border-width:1px;
  border-style:solid;
  vertical-align:middle;
  text-align:center;
  margin-bottom:20px;
  }
.artikel{
  position:absolute;
  top:0px;
  left:135px;
  width:400px;
  height:130px;
  border-color:#252d51;
  border-width:1px;
  border-style:solid;
  vertical-align:middle;
  text-align:center;
  margin-bottom:Wert;
  }

[MudGuard]

Hi,

das einzieg was nicht richtig funktioniert ist vertical-align:
Hab ich da einen grundsätzlichen Denkfehler drin oder worin liegt das Problem?

Du hast nicht beachtet, für welche Elemente vertical-align definiert ist.

cu,
Andreas

[TomIRL]

Moin,

Hi,

das einzieg was nicht richtig funktioniert ist vertical-align:
Hab ich da einen grundsätzlichen Denkfehler drin oder worin liegt das Problem?

Du hast nicht beachtet, für welche Elemente vertical-align definiert ist.

Hm gut.. für Inline Elemente..
Ich muß doch jetzt nicht allen ernstes in diesem Element irgendetwas aufspannen um den Text mittig zu zentrieren?
Hast Du ne Idee für eine sinnvolle Lösung?

Viele Grüße TomIRL

[Axel Richter]

Hallo,

Du hast nicht beachtet, für welche Elemente vertical-align definiert ist.
Hm gut.. für Inline Elemente..

... und für Tabellenzellen.

Da display:table-cell nicht vom IE unterstützt wird, funktioniert so etwas eben immer noch _nur_ in Tabellen.

viele Grüße

Axel

[TomIRL]

Moin,

Hallo,

Du hast nicht beachtet, für welche Elemente vertical-align definiert ist.
Hm gut.. für Inline Elemente..
... und für Tabellenzellen.

Da display:table-cell nicht vom IE unterstützt wird, funktioniert so etwas eben immer noch _nur_ in Tabellen.

Ist irgendwie unlogisch oder nicht?
Wenn ich text-align: nehme, das funktioniert, aber mal eben einfach so einen Text in die Mitte einer Box zu bringen, da muß ich dann letztlich ne Tabelle einbauen?
Wenn dem tatsächlich so ist, dann steht für mich tatsächlich die Frage nach dem Sinn und Zweck von Css im Proffessionellen Einsatz.
Dann kann man css allenfalls dazu benutzen im privaten Bereich irgenwas mal eben so hinzufrikeln, wie ich es zum nur Glück machen muß.

TomIRL

[Axel Richter]

Hallo,

Da display:table-cell nicht vom IE unterstützt wird, funktioniert so etwas eben immer noch _nur_ in Tabellen.

Ist irgendwie unlogisch oder nicht?

Nein.

HTML ist Hyper_Text_Markup. Text steht normalerweise in Zeilen. Die Zeilenhöhe kannst Du beeinflussen und innerhalb der Zeile kann Text auch in der Mitte positioniert werden. Mehrere Zeilen in einem Block-Element bilden eine Box. Die Gesamthöhe dieser Zeilen bildet die Inhaltshöhe der Box. Über und unter dieser Inhaltshöhe kann es padding, border und margin geben. Kennst Du also die Inhaltshöhe, dann kennst Du auch die Gesamthöhe der Box, inklusive margin, border und padding.

Eine Box mit vorgegebener Höhe, in der sich mehrzeiliger Text an der vertikalen Mitte der Box ausrichtet, ist kein normaler Fließtextkontext. Das gibt es nur als Tabellenzelle.

viele Grüße

Axel

[Andreas Lindig]

Hallo Tom,

Wenn dem tatsächlich so ist, dann steht für mich tatsächlich die Frage nach dem Sinn und Zweck von Css im Proffessionellen Einsatz.

herzlichen Glückwunsch! Du hast damit den Unsinn der Puristen-Debatten für oder gegen CSS entdeckt. :-)

Was da manchmal an abenteuerlichen Workarounds vorgeschlagen wird, nur um Tabellen zu meiden, ist... eben abenteuerlich ;-)

Gruß, Andreas