Bootstrap gleiche Breite für Etiketten

Question

Ich benutze Bootstrap 3. Ich habe 5 verschiedene label s und ich möchte ihre width auf die maximale eins und zentrieren Sie den Text.

Zum Beispiel jedes label ‚s width sollte rot gleich eins sein.

<span class="label label-md label-danger">Merkez Tarafından Reddedildi</span> 

Answer 1

weil .label inline ist, müssen Sie sich als inline-block gesetzt und stellen Sie dann eine min-width

Der Bootstrap bereits zentriert den Text in .label also keine Notwendigkeit, sich um das zu kümmern.

Hinweis: verwendet !important nur für die Demo, vermeiden Sie um jeden Preis in Ihrem Code verwenden.

.label { 
 
    min-width: 200px !important; 
 
    display: inline-block !important 
 
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" /> 
 
<span class="label label-md label-danger">Merkez Tarafından Reddedildi</span> 
 
<hr /> 
 
<span class="label label-md label-info">Merkez</span> 
 
<hr /> 
 
<span class="label label-md label-warning">Merkez Tarafından </span> 
 
<hr /> 
 
<span class="label label-md label-success">Tarafından Reddedildi</span> 
 
<hr /> 
 
<span class="label label-md label-default">Tarafından</span> 
 
<hr /> 
 
<span class="label label-md label-primary">Tarafından lipsum</span>

Answer 2

Ich kann nicht an die genaue Antwort denken, die Sie wollen, aber vielleicht wird dies noch besser für Sie sein.

.label { 
    width:200px; 
    white-space: nowrap; 
    overflow: hidden; 
    text-overflow: ellipsis; 
} 

.label:hover { 
    white-space: normal; 
}