html - 宽度 - 表格单元格显示的 50% 分成单独的行

标签 html css

我正在尝试显示一个以表格形式显示信息的面板, enter image description here

我的代码是 here .现在,我使用 display:table-rowNAME 标签和值 My Venue 放在一个地方。当我给 table-cell 显示 50% 的宽度时,它会分成下一行,

enter image description here

我可以通过将 table-cell 显示的宽度设置为 49% 来修复它。

我很好奇为什么 50% 宽度将它分成不同的行,因为 table 显示没有任何边距。

最佳答案

两个跨度之间有空格。该空白被呈现为一个空格,该空格具有非零宽度。在 50% 加上一个空间的宽度后,没有空间再容纳 50%,因此第二个跨度会换行。如果你对接 </span><span>彼此之间没有空格,包装消失了。有other ways to deal with the problem ,包括将字体大小调整为 0,使空间的宽度为零,或使用其他方法进行布局。

关于html - 宽度 - 表格单元格显示的 50% 分成单独的行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36637021/

相关文章:

javascript - 如何让一个div不移动另一个

css - 输入不同颜色星号的占位符?

html - 如何顺利隐藏显示图片?网页格式

html - 叠加图像问题

javascript - 如何在没有像素模糊的情况下调整 html5 Canvas 大小

javascript - 使用javascript通过修改图像url来实现响应式图像;无图片标签

html - 页脚总是在最底部(随内容移动,但最小值在底部)

表格中的 JavaScript 复选框验证

javascript - Drupal 7 + smoothdivscroll?

javascript - 标识符已声明 - 标识符 'userScore' 已被声明