在此示例中删除楼梯

-2

在此示例中是否可以删除楼梯效果？我有一个div向右浮动，几个div固定高度，固定宽度向左浮动。如果div遇到某处，我会得到一个相当奇怪的楼梯效果。在此示例中删除楼梯

我知道为什么发生这种情况，我得到它，但即时通讯寻找一种解决方案，以避免这种情况。请帮我

<div class="container"> 
    <div class="fright">just some contents floating right</div> 
    <div class="fleft">a div</div> 
    <div class="fleft"> 
     this one is the problem. 
     Is it possible to have this div start at position B 
    </div> 
    <div class="fleft"><b>Position B</b></div> 
    <div class="fleft">a div</div> 
</div>

和CSS

div{ 
    margin:10px; 
    padding:10px; 


.container{ 
    width:460px; 
    float:left; 
} 

.fright{ 
    float:right; 
    border:1px solid green; 
} 

.fleft{ 
    float:left; 
    height:180px; 
    width:180px; 
    border:1px solid orange; 
}

http://jsfiddle.net/FusWd/1/

来源

2012-11-19 user1416256

你可以让你想怎么转出的例子吗？ –

除了使用浮动的，则可能需要使用inline-block的做你的布局尝试。

我已经更新您在这里例如：http://jsfiddle.net/FusWd/4/

有一些注意事项使用这种技术：

IE 6-7不支持inline-block的，你必须使用'hasLayout'技巧。
内嵌块元素受标记中的空白影响，这可能会或可能不会破坏您的布局。这有几个解决方案。
- 可以删除内联块元件之间的空白在您的标记
- 设置父元素的字体尺寸和行高为0，和字母间距和字间距性质-1px，然后复位font-size和line-height设置为所需的值，并将字母间距和字间距属性重置为normal值。

来源

2012-11-19 13:18:48

是的是的正是我正在寻找的！多谢！！！ – user1416256

没问题。如果答案对您有用，您应该将其标记为已接受的答案。阅读更多关于这里的stackoverflow约定：http://stackoverflow.com/faq#howtoask –

在此示例中删除楼梯

回答

相关问题