display：inline重置高度和宽度 [英] display:inline resets height and width
问题描述
我在 http://jsfiddle.net/GKnkW/2/ 创建了示例
html
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
</head>
<body>
<div class="step">1</div>
<div class="step">2</div>
<br/><br/>
<div class="step1">3</div>
<div class="step1">4</div>
</body>
</html>
css
.step
{
height:150px;
width:150px;
background:yellow;
display:inline;
}
.step1
{
height:150px;
width:150px;
background:yellow;
}
我想显示两个div并排显示它们的原始高度和宽度设置在css）
一旦我添加display：inline属性到css它似乎宽松的高度和宽度前面定义。 [检查与＃1和＃2的div，似乎宽松的高度和宽度设置]
I want to display two divs side by side with their original height and width ( set in css ) as soon as i add display:inline property to css it seems to loose height and width defined earlier. [ check divs with # 1 and #2 which seems to loose height and width setting ]
可以指出一个错误，我似乎正在做或解决方法奇怪的行为？
can some one pin point an error which I seems to be doing or workaround for this weird behavior ?
推荐答案
内联对象没有高度或宽度。为什么要将它们设置为内联开始？你可能想要浮动或使用inline-block。
Inline objects don't have heights or widths. Why are you setting them inline to begin with? You probably want to either float them or use inline-block.
这篇关于display：inline重置高度和宽度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
