[CSS] Text in Blockelement vertikal zentrieren

[sverebom]

Hi,

ich hänge mich momentan daran auf, einen Einzeiler in einem DIV-Tag bzw. Block-Element vertikal zu zentrieren (siehe Anhang).

Der Code für alle Fälle:

<div id="title">
    <p>Lorem Ispum Dolor</p>
</div>


und der dazugehörige CSS-Code


#title {
	width: 760px;
	height: 30px;
	background: transparent url(bilder/hg_title.gif) repeat-y right;
}

#title p {
	margin: 0;
	color: #FFFFFF;
	font-size: 14px;
	font-weight: bold;
	padding: 0 0 0 270px;
}

Danke für eure Hilfe

 

[mh1001]

Hallo,

wenn ich dich jetzt richtig verstanden habe, geht es dir nur darum, einen einzeiligen Text in einem entsprechenden Container, welcher eine Höhe von 30 Pixeln hat, vertikal zu zentrieren.

In diesem Fall, setzte einfach das Attribut "line-height" mit einem Wert von "30px" ein, dann sollte dein Problem behoben sein.

MfG mh1001

/Edit: Also etwa so:

 #title {
	width: 760px;
	height: 30px;
	background: transparent url(bilder/hg_title.gif) repeat-y right;
	font-size: 14px;
	font-weight: bold;
	line-height: 30px;
}

//----------------------//

<div id="title">
    Lorem Ispum Dolor
</div>

 

[sverebom]

Ha, das wußte ich natürlich, wollte dich nur mal testen und du hast den Test bestanden. Weiter machen!



Mei, auf line-height hätte ich eigentlich auch selber kommen können ich Pflaume. Danke für deine Hilfe