2

我有一个简单的表单,其中包含一个电子邮件字段和一个提交按钮,我正在应用弹性框布局。flexbox 本身工作正常,但似乎 webkit 在输入元素旁边添加了一些额外的间距(非输入元素似乎很好)。此问题在 IE11 和 Firefox 中不会出现,但在 Opera 和 Chrome 中存在。因为 IE 和 Firefox 不这样做,所以很难创建一致的跨浏览器 UI。是否有一些属性可以覆盖以防止添加这个额外的空间?或者这是一个错误?

<section id="inputContent">
    <input type="Email"/>
    <input type="Submit"/>
</section>

section
{
    display:flex;
}

小提琴:http: //jsfiddle.net/Dragonseer/2H2P5/

4

1 回答 1

0

它的边框和边距使它看起来如此,添加

input{
    margin:0;
    border:1px solid;

}

而且不会有空间

http://jsfiddle.net/2H2P5/2/

于 2013-10-15T23:57:18.243 回答