Sémantique de l'INTERFACE utilisateur: aligné à droite/flottait bouton

Comment aligner un bouton correctement à l'aide de la Sémantique de l'INTERFACE utilisateur à le droit? J'ai essayé des choses comme:

            <div class="ui mini labeled input">
                <div class="ui label">Description</div>
                <input placeholder="Privat" type="text">
            </div>
            <div class="ui floated right red mini button">
                Remove
            </div>
            <br />

Mais le bouton est toujours en dessous du champ de saisie. Pourriez-vous expliquer (en plus de la solution correcte) pourquoi cela se produit? Dois-je utiliser une grille?

Deuxième question, à côté de cela:

Deux entrées étiquetées comme

            <div class="ui mini labeled input">
                <div class="ui label">description</div>
                <input placeholder="Privat" type="text">
            </div><br/>
            <div class="ui mini labeled input">
                <div class="ui label">another description</div>
                <input placeholder="Privat" type="text">
            </div>

N'ont pas la même longueur. Ni le gris de l'étiquette, ni la totalité du champ de saisie. Est-ce alignable?

jsfiddle test

Merci d'avance! 🙂

OriginalL'auteur user2084865 | 2015-03-22

  1. 4

    Les éléments sont inline-flex (inline-block), c'est pourquoi vous avez à briser les lignes manuellement à l'aide de <br />.

    Voir: https://jsfiddle.net/4p6d7x86/2/

    Merci 🙂 j'ai un problème bizarre: Mes éléments sont display: table pas inline-flex. Par rapport classe de jsfiddle vs mon vrai code: .ui.labeled.input. Avez-vous une idée?
    Dans ce cas, changer l'enfant de l'élément display à table-cell.
    Me semble que je n'étais pas à l'aide de l'actuel SemanticUI version. Après la mise à jour, tout fonctionne comme prévu.

    OriginalL'auteur Alex