html - 如何避免 &lt;input&gt; 和 <span> 元素之间出现小空间?

标签 html css

<分区>

我有以下内容:

<input style="width: 20px" data-ng-model="row.number" type="text" />
<span style="width: 20px">-</span>

如何避免 <input> 之间的小空间?和 <span> ,以及如何将“-”置于跨度的中心。

我需要一种解决方案,而不是在我的 IDE 重新格式化为多行时将所有内容放在一行中。

最佳答案

默认情况下,span内联 级别元素,它尊重标记中的空白。

有多种方法可以删除它,一种是简单地删除标记中的空格:

<input style="width: 20px" data-ng-model="row.number" type="text" /><span style="width: 20px">-</span>

jsFiddle example


另一种方法是将父元素设置为font-size:0px

jsFiddle example


另一个是设置负边距以取代空白。 跨度{边距:-4px; }

jsFiddle example

关于html - 如何避免 &lt;input&gt; 和 <span> 元素之间出现小空间?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19749598/

相关文章:

javascript - html servlet 的客户端密码加密

css - 匿名 block 盒 vs block 元素

javascript - 在 JavaScript 中创建并保存到文件新的 png 图像

jquery - 如何在特定页面上更改导航栏的颜色?

html - 背景不会显示并覆盖所有 div

html - 如何考虑 :nth-child 的 child

html - Windows(Chrome、Edge 等)和 Macos(Safari)中的边距不同

javascript - 尝试将 props 传递给 Vue 中的 child : “Expected String with value ” [object Object ]“, got Object”

javascript - 第一项的旋转木马填充

css - 使用 Javascript 修改 css 类