Wie kann ich meine Twitter Bootstrap Schaltflächen rechtsbündig ausrichten?

Ich habe hier eine einfache Demo:

http://jsfiddle.net/HdeZ3/1/

<ul>
    <li>One <input class="btn pull-right" value="test"></li>
    <li>Two <input class="btn pull-right" value="test2"></li>
</ul>

Ich habe eine ungeordnete Liste und für jedes Listenelement möchte ich Text auf der linken Seite und dann eine rechts ausgerichtete Schaltfläche haben. Ich habe versucht, pull-right zu verwenden, aber das bringt die Ausrichtung völlig durcheinander. Was mache ich falsch?

Zim
Bearbeitete Frage 18. Mai 2017 в 10:07
Programmierung
twitter-bootstrap-2 twitter-bootstrap-3 twitter-bootstrap bootstrap-4
16. März 2013 в 6:11
13 Aufrufe
Lösung

Fügen Sie "pull-right" in das Klassenattribut ein und lassen Sie Bootstrap die Schaltflächen anordnen.

Für Bootstrap 2.3, siehe: http://getbootstrap.com/2.3.2/components.html#misc > Helper classes > .pull-right.

Für Bootstrap 3, siehe: https://getbootstrap.com/docs/3.3/css/#helper-classes > Hilfsklassen.

Für Bootstrap 4, siehe: https://getbootstrap.com/docs/4.0/utilities/float/#responsive

Der Befehl pull-right wurde entfernt und durch float-right oder allgemein durch float-{sm,md,lg,xl}-{left,right,none} ersetzt

zwl
Bearbeitete Antwort 29. März 2018 в 7:34
Kommentare (4)
 
<ul>
    <li class="span4">One <input class="btn btn-small" value="test"></li>
    <li class="span4">Two <input class="btn btn-small " value="test2"</li>
</ul>

ich habe gerade layout..apply styles für li..

oder

<ul>
    <li>One <input class="btn" value="test"></li>
    <li>Two <input class="btn" value="test2"</li>
</ul>

in CSS

li {
    line-height: 20px;
    margin: 5px;
    padding: 2px;
}
sasi
Bearbeitete Antwort 16. März 2013 в 6:29
Kommentare (2)

Können Sie versuchen, eine benutzerdefinierte CSS neben der Bootstrap-CSS, um zu sehen, wenn keine Änderungen. Versuchen Sie

.move-rigth{
    display: block;
    float: right;
}

Wenn es funktioniert, dann können Sie versuchen, zu manipulieren, was Sie haben, oder fügen Sie andere Formatierung zu diesem und erreichen, was Sie wünschen. Nur weil Sie Bootstrap verwenden, bedeutet das nicht, dass Sie es einfach verwalten können, wenn es Ihnen nicht das bietet, was Sie wollen. Sie arbeiten mit Ihren Codes, und so befehlen Sie ihm, das zu tun, was Sie sagen. Prost!

Kommentare (2)