[GELÖST] <div> Inhalt vertikal zentrieren

[mmTests]

GEKLÄRT

Schönen Guten Abend allerseits,

mich hat die Lust wieder gepackt, an meiner Homepage zu arbeiten, bzw. eine neue zu Beginnen. Da hab ich gleich mal eine Frage zu! Damit ihr es besser versteht, kommt vorab schon einmal der kurze Code um den es sich handelt:

#button{
	display: inline-block;
	position: relative;
	border-top: #000000 1px solid;
	border-bottom: #000000 1px solid;
	text-align: center;
        font-size:20px;
        height:40px;   
}

Geplant war, das der Text mittig in einem Kasten steht (oben und unten mit einer Linie getrennt). Weil der Kasten eine Mindesthöhe haben sollte, und nicht an die Schriftgröße angepasst werden soll, habe ich dort eine kleine Höhe (height:40px) eingebaut. Mein Problem ist, dass nun der Text nach oben an den Kasten gequetscht wird, quasi horizontal nach oben versetzt ist.

Ein langes "drum herrum" um solch eine "kurze" Frage... Ich hoffe ihr habt verstanden was ich meine :S...

Lg Maxi

 

[mmTests]

AW: <div> Inhalt horizontal zentrieren

Um das Problem nochmal zu Visualisieren:

So sieht es aus:

___________
Text
___________

So sollte es aussehen:

___________

Text
___________

Lg Maxi

 

[dkdenz]

AW: <div> Inhalt horizontal zentrieren

Lass mal das height weg und dann ist line-height Dein Freund ...

 

[mmTests]

AW: <div> Inhalt horizontal zentrieren

Danke, mal wieder, für die super schnelle, super kompetente und super hilfreiche Antwort!

Frage geklärt - Danke!

Lg Maxi

 

[mikdoe]

AW: <div> Inhalt horizontal zentrieren

Dann reden wir aber von vertikaler Zentrierung, nicht horizontaler.
Merksatz: horizontal ist immer wie der Horizont am Himmel, nämlich waagerecht.

Ich ändere mal den Titel entsprechend ab.

 

[mmTests]

AW: <div> Inhalt horizontal zentrieren

Oh ähm... Wenn man nicht aufpasst...

Dankeschön