3

当一个 div 被设置为“内联”时,它的所有维度变量似乎都失去了效果。

例如

<div id="test" style=" border: 1px solid;padding:3px;width:40px; height:100px;">
foobar
</div>

给了我一个大盒子,但在我添加内联样式后,盒子缩小到最小尺寸。

例如

<div id="test" style="display:inline; border: 1px solid;padding:3px;width:40px; height:100px;">
foobar
</div>

我的问题是,有没有一种方法可以保持 div 内联(与前面的一些文本相同的行),同时能够修复它的大小。(div 或 span)

谢谢。

4

3 回答 3

14

内联元素的宽度被忽略。根据我的经验,在这种情况下使用 afloat将解决问题。

您也可以使用inline-block,但如果您必须支持较旧的浏览器,您可能不希望使用它。

浮动的 div 将浮动到最近的块元素父级的左侧(假设这个父级也没有浮动)。如果您需要更多地控制 div 的浮动位置,请在浮动 div 周围添加一个包装(非浮动和块)div

于 2012-05-30T20:27:48.707 回答
2

使用display: inline-block或(更好)display: block; float: left

于 2012-05-30T20:27:42.190 回答
1

利用display: inline-block;

PS:inline-block在一些较旧的浏览器中不可用。

于 2012-05-30T20:27:00.537 回答