Textausrichtung im <div> Element

[Rolf b]

Darf ich Dir diesen Artikel aus dem SelfHTML Wiki ans Herz legen?

Zentrierte Inhalte

Hab's grad man gefiddelt, sieht bei mir so aus:

<main>
<div id="topic_left">
<h2>Veranstaltungen</h2>
</div>
</main>

main {
  position:relative;
  width: 300px; height: 300px;
  background-color: #fcc
}
#topic_left {
	position: absolute;
	left:20px;   top:18px;   width:106px;   height:250px;
	z-index:5;
	background-color: #ccf;
	display: flex; align-items:center;justify-content:center;
}

h2 
{
	font: bold 18px arizona, arial, verdana;
	transform: rotate(-90deg);
	color: #670000;
	background-color: white;
}

Die Hintergrundfarben dienen nur der Visualisierung, wo welche Box ist. Deine Font-Tags habe ich zusammengefasst.

Die Magie ist die Flexbox. Wenn das in deinem Kontext nicht funktionieren sollte, bietet der verlinkte Artikel noch reichlich Alternativen an.

Rolf