语义 UI:右对齐/浮动按钮

use*_*865 5 html css semantic-ui

如何使用右侧的 Semantic-UI 正确对齐按钮?我试过这样的事情:

            <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 />
Run Code Online (Sandbox Code Playgroud)

但按钮始终位于输入字段下方。您能否解释(除了正确的解决方案)为什么会发生这种情况?我必须使用网格吗?

除此之外的第二个问题:

两个标记的输入,如

            <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>
Run Code Online (Sandbox Code Playgroud)

不要有相同的长度。灰色标签和总输入字段都没有。这个可以对齐吗?

jsfiddle测试

提前致谢!:)

Ale*_*lex 4

元素是inline-flex( inline-block),这就是为什么您必须使用 手动换行<br />

请参阅: https: //jsfiddle.net/4p6d7x86/2/