当前位置: 首页 > 面试题库 >

两个内联块,宽度为50%的元素绕到第二行

吉和同
2023-03-14
问题内容

我希望有两列宽度为50%的列,并避免出现浮点数。所以我想用display:inline-block

当元素添加到99%的宽度(例如50%,49%)时,它将按预期工作。

当使用100%的宽度(例如50%,50%)时,第二列会中断到第二行。

这是为什么?


问题答案:

这是因为要display:inline-block考虑html中的空白。如果您删除之间的空白,则div可以正常使用。

<div id="col1">content</div><div id="col2">content</div>


 类似资料:
  • 问题内容: 我想有两列宽度为50%的列,并避免出现浮点数。所以我想用。 当元素添加到99%的宽度(例如50%,49%,http://jsfiddle.net/XCDsu/2/)时,它将按预期工作。 当使用100%的宽度(例如50%,50%,http://jsfiddle.net/XCDsu/3/)时,第二列会中断到第二行。 这是为什么? 问题答案: 这是因为考虑到html中的空白。如果您删除之间的

  • 问题内容: Width issue Left Right 上面的代码试图将#left div和#right div并排放置在一行中。但是,正如您在上面的JSFiddle URL中所看到的,情况并非如此。 我能够解决将div之一的宽度减小到49%的问题。但这不是理想的解决方案,因为两个div之间出现很小的间隙。 我能够解决问题的另一种方法是通过同时浮动两个div。这很好。 但是我最初的问题仍然存在。

  • 问题内容: 您可以设置诸如,和的内联元素的宽度,但是在放置它们之前不会发现任何效果。 a)我认为不能设置内联元素的内联宽度? b)假设可以设置宽度-在放置内联元素之前,我们不会注意到任何效果(因此我们指定了宽度)。位置如何/在哪里? c)为什么仅当我们“定位”内联元素时才显示它们的宽度? 问题答案: 正如其他人提到的那样,设置内联元素的宽度(或其他一些与位置相关的属性)将导致浏览器将元素显示为块元

  • 问题内容: 如果内容因屏幕宽度而断线,如何获取适合其内容宽度的元素? 我想不出如何表达这个问题,听起来似乎很简单,但是我整理了一个简单的插图。 问题答案: 你不能 默认情况下,元素具有缩小到适合的宽度: 收缩至配合宽度为: 。 然后, 当为时,宽度将为您所希望的。 当为时,宽度将为您所希望的。 当,宽度将是,即使你不喜欢它。 如果您确实不希望这样做,我想您可以使用JS 添加事件侦听器,然后手动设置

  • 问题内容: 我最近一直在尝试找出何时适合使用s。它们似乎比仅一个元素有用得多。实际上,内联块元素似乎能够执行块元素可以做的任何事情,但是要有一些额外的样式。 与的元素有什么区别吗?(除了一个更长的事实?) 问题答案: 您所说的完全正确:“内联块元素似乎能够执行块元素可以做的任何事情,但要有一些额外的样式。” 这主要是由于两者的共同点是它们都是块容器。 但是,有一个陷阱。 块框参与块格式化上下文,内

  • 问题内容: 举个例子 是在HTML5有效吗? 问题答案: 是的,您编写的内容在HTML5中有效,但并非所有内联元素,我认为这只是适用于.. 参考:HTML5中的“块级”链接 提示:如果使用此设置,则to 或可能会有意外的视觉样式结果 更新: 对于“默认样式可能会导致混淆”的其他“内联代码块”组合,则“不允许”使用-说明在这里 ### 默认样式可能导致混淆的情况 某些元素具有默认样式或行为,这些默认