html - HTML 输入和按钮之间的空白

标签 html css

<分区>

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

<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>

最佳答案

font-size:0; 添加到周围的 div 中,如下所示:

.no-gap {
  font-size:0;  
}
<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>

关于html - HTML 输入和按钮之间的空白,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33522337/

上一篇:php - Wordpress Genesis——在标题中创建两个菜单位置(主要+次要)

下一篇:html - 在 CSS 中处理行内 block 网格和字体大小的可维护方法

相关文章:

html - 滚动 DIV,我想要一个 100% 高度的 DIV

c# - 在html中格式化数字字符串

javascript - Rails、Bootstrap、尝试动态加载模式无法按预期工作

html - "display: none"with highcharts - 大小不正确

javascript - 有没有和animationEnd功能一样的无限CSS动画的东西?

javascript - 如何为 HTML 数字输入元素设置特定的拒绝消息?

javascript - 模板助手中的 Meteor QuickForm 异常 : Error: Recipes is not in the window scope

javascript - 更改元素 :after content depending on textContent of seperate element using Vanilla JavaScript

iphone - 是否溢出 :hidden applied to <body> work on iPhone Safari?

javascript - 单击 SVG 后如何显示工具提示?