Bootstrap: Wie man die Schaltfläche neben der Eingabegruppe platziert
Ich kann nicht (konform mit "korrektem Bootstrap") herausfinden, wie man einen Knopf bekommt, der neben einer Eingabegruppe innerhalb eines div steht.
Sie müssen mittig ausgerichtet sein.
So möchte ich aussehen ...
Das ist was passiert ...
Hier ist mein aktueller Code.
%Vor%Ich habe diese js Geige erstellt ... Ссылка
Danke!
6 Antworten
Sie können auch die pull-left Klasse ausprobieren.
Die Klassen .pull-left und .pull-right existieren ebenfalls und waren vorher Wird als Teil der Medienkomponente verwendet, ist jedoch für diese Verwendung veraltet ab v3.3.0. Sie sind in etwa äquivalent zu .media-left und .media-right, außer dass .media-right nach der .media-body im html.
Der html:
%Vor%Sie können verwenden:
%Vor%, um nach dem div einige Abstände hinzuzufügen, und dann wäre das neue Markup wie folgt:
%Vor% div s sind Blockelemente , was bedeutet, dass sie vertikal ausgerichtet sind. Zum Beispiel
würde ergeben:
%Vor% Damit die Elemente horizontal fließen, müssen Sie div inline erstellen, da Inline-Elemente horizontal fließen können, z. B. Text und <span> .
Sie können Ihrer CSS eine Regel hinzufügen:
%Vor%Und natürlich sollten Sie der Schaltfläche ein ID-Attribut hinzufügen.
Falls das oben genannte nicht funktioniert, sollten Sie alle Elemente in ein div einfügen, da <button> , <input> und <span> alle Inline-Elemente sind.
Fügen Sie einfach die Gitterklassen hinzu. Probieren Sie dies
aus %Vor%Mit Ihrem aktuellen Code können Sie die flexbox verwenden.
Ein leistungsfähiges CSS-Layout-Modul, das uns eine effiziente und einfache Möglichkeit bietet, Dinge zu planen und auszurichten.
%Vor% Dies ist der Screenshot des Ergebnisses: 
Sie können hier mehr über flexbox erfahren: Ссылка
Prost!
Tags und Links html css twitter-bootstrap