Ich habe eine div mit einer Höhe von 30px.Wie zentriere ich ein Label vertikal in einem div?
Ich möchte diesen Text div hinzufügen. Wie kann ich den Klartext in der Mitte meines div erscheinen lassen? , d. H. Der Text wird 15px unter der Oberseite der div gezeigt.
Ich habe versucht, ein Etikett mit Rand oben: 15; aber es hat nicht funktioniert.
Verwenden Sie padding-top anstelle von margin-top. Denken Sie daran, dass das Hinzufügen von Füllmaterial zum oberen Rand zur Höhe hinzugefügt wird. Daher müssen Sie den Betrag verringern, den Sie für das Auffüllen von der Höhe aus verwenden. Wenn Sie nur immer für den Text 15px oben und unten davon zu haben, einfach nur tun:
padding: 15px 0px;
Ohne Höhe überhaupt angeben.
padding-top: 15px;
entfernen 15px von der Höhe auf dem Div zu.
sollten Sie einen Blick auf padding haben http://www.w3schools.com/css/css_padding.asp
vergessen Sie die Höhe des zu berücksichtigenden Textes. – mauris
Sie können:
<div style="height:30px; line-height:30px; text-align:center;">
Label
</div>
die line-height des Textes Set hilft Ihnen, die Höhe nur für eine Zeile zu passen.
Hinzufügen von Zeilenhöhe zu meinem Div Stil gelöst das Problem – Ziggler
, wenn Sie etwas wollen, in der Mitte davon zu sein ist Elternteil, geben Sie einfach die Eltern bestimmte Breite Stil verwenden und das Kind style = geben „margin: 0 auto“. Glück
Horizontal und nicht IE6, ja. Aber die Frage war die vertikale Positionierung. –
Nach CSS würde
text-align:center;
vertical-align:middle;
display:table-cell;
Nicht in IE obwohl ... – DisgruntledGoat
@DisgruntledGoat arbeitete in IE8, welche IE speziell funktioniert das nicht? – anpatel
@MyName Diese Antwort wurde ursprünglich gepostet ** vor 3 Jahren **, als IE6 und IE7 noch einen großen Marktanteil hatten. So, jetzt sollte es eigentlich in Ordnung sein zu verwenden. – DisgruntledGoat
Das <label></label> Element ist kein Block-Level-Element funktioniert es ein Inline-Element ist.
Versuchen Sie diesen Code <div style="height:30px"> <label style="display:block; margin-top:15px;"> </label> </div>
#MyDiv
{
background-image: url(images/pagedescription_bar.png);
background-repeat: repeat-x;
border-color: #868686;
border-width: thin;
border-style: solid;
border-style: none;
width: 1008px;
height:70px;
color: #FB8022;
font-size: 16px;
font-weight: bold;
}
#MyDiv label
{
width: 1008px;
text-align: center;
height: 70px;
vertical-align: middle;
display:table-cell;
}
Ich denke, die Fragesteller will es 30px, Texthöhe inklusive sein. – mauris
nervtötende Zeit, die sich mit dem Anreden dieses Kontaktformulars beschäftigt, Ihr Vorschlag hat es gelöst, thx !! – dcparham