Question

我有一个带标签的文字输入，除此之外我还有一个按钮来做一些事情而不是提交输入和按钮所在的表格。我将输入（带标签）放在twelve wide field中，按钮位于four wide field内：

<div class="two fields">
    <div class="twelve wide field">
        <label for="postalCodeMain">Postcode</label>
        <input type="text" id="postalCodeMain" value=""/>
    </div>
    <div class="four wide field">
        <div class="ui fluid bottom button" onclick="getLocations('Main');">Search for Address</div>
    </div>
</div>

问题是该按钮浮动到four wide field的顶部，因为输入上方有标签，这是让按钮与输入内联的最佳方法是什么？

我尝试了很多方法，但是将标签放在字段之外会导致标签和输入之间的间隙过大，并且在按钮顶部添加一个空标签会让我感到浪费...？< / p>

以下是我在JSFiddle上尝试过的方法。

我错过了按钮div的课程吗？

Answer 1

好了我愚蠢的颜色，在阅读了文档之后，我发现这很简单：

    <div class="field">
        <label for="postalCode05">Postcode</label>
        <div class="ui action input">
            <input type="text" id="postalCode05" placeholder=""/>
            <button class="ui button">Search</button>
        </div>
    </div>

我更新的JSFiddle

中的示例

语义UI内联按钮

1 个答案: