Question

我想在输入框旁边有一个按钮，所以我做了以下操作。

<div>
    <input/>
    <button>Do something</button>
</div>

这在输入和按钮之间留下了一个小差距。

令我惊讶的是，这并没有

<div>
    <input/><button>Do something</button>
</div>

我的问题是：

我认为差距是故意的，代表我换行的空白区域。这个假设是否正确，是否有一些良好的做法可以避免这个问题？我可以调整差距，还是应该坚持将标签放在同一条线上？

我试图在这里代表我的问题http://jsfiddle.net/jonnymoo/2wzdzfan/5/

<div>
    <input value="look no gap between me"/><button>and me</button>
</div>
<div>
    <input value="But there is here"/>
    <button>and here</button>
</div>
<div>
    Is it just the same as me
    and me?
</div>

Answer 1

将font-size:0;添加到周围的div，如下所示：

＆＃13;

.no-gap {
  font-size:0;  
}

＆＃13;

<div>
    <input value="look no gap between me"/><button>and me</button>
</div>
<div class="no-gap">
    <input value="But there is here"/>
    <button>and here</button>
</div>
<div>
    Is it just the same as me
    and me?
</div>

＆＃13;

HTML输入和按钮之间的空格

1 个答案: