在宽屏幕中断开的语义-UI字段按钮边距

时间:2015-02-09 12:33:01

标签: css semantic-ui

我有一个带有一些字段的表单。当我调整浏览器窗口的大小时,字段之间的距离会被破坏。我不知道如何保持始终相同的字段之间的距离。如果您访问下面的链接,您可以在3,4,5字段中看到它发生以调整结果窗口的大小:

http://jsfiddle.net/Lj3w4z3m/1/

<div class='ui form '>
<div class='fields'>
    <div class='eight wide field'>
        <label>field 1</label>
        <input name='Status' type='text' value='Enviado para a junta' readonly='readonly'>
    </div>
    <div class='eight wide field'>
        <label>field 2</label>
        <input name='ProximoStatus' type='text' value='Retorno da junta' readonly='readonly'>
    </div>
</div>
<div class='fields'>
    <div class='sixteen wide field'>
        <label>field 3</label>
        <input name='Observacao' type='text' value=''>
    </div>
</div>
<div class='fields'>
    <div class='sixteen wide field'>
        <label>field 4</label>
        <input name='Observacao' type='text' value=''>
    </div>
</div>
<div class='fields'>
    <div class='sixteen wide field'>
        <label>field 5</label>
        <input name='Observacao' type='text' value=''>
    </div>
</div>

非常感谢。

1 个答案:

答案 0 :(得分:0)

我已经更新了小提琴。请检查一下。我认为这将解决您的问题。

<div class='ui form '> <div class='fields'> <div class='eight wide field'> <label>field 1</label> <input name='Status' type='text' value='Enviado para a junta' readonly='readonly'> </div> <div class='eight wide field'> <label>field 2</label> <input name='ProximoStatus' type='text' value='Retorno da junta' readonly='readonly'> </div> <div class='sixteen wide field'> <label>field 3</label> <input name='Observacao' type='text' value=''> </div> <div class='sixteen wide field'> <label>field 4</label> <input name='Observacao' type='text' value=''> </div> <div class='sixteen wide field'> <label>field 5</label> <input name='Observacao' type='text' value=''> </div> </div> </div>