css - 将内容流出 body 的最佳方式

Question

我正在设计一个博客布局，其中一些信息(蓝色框)是从帖子的正文中取出的，如下所示: http://jsfiddle.net/rhr96/

这样做的好处是什么？

目前我在做:

position: absolute;  
margin-left: negative value; 

使蓝色框向左流动。

但我也可以这样做:

position: relative;  
float: left;
right: some px;

其中任何一个被认为更好？或者还有其他方法吗？

Answer 1

简答:POSITION ABSOLUTE

原因:设计者使用 position: absolute 因为这是从正常文档流中取出元素的正确方法，使用 float: left; 不会取出蓝框出文档流...

编辑:刚刚明白你真正想要的是什么，我在这里做了一个新的1，你可以看看..

Demo

HTML

<div class="container">
    <div class="block">1</div>
    <div class="content">This is a question</div>
</div>

CSS

.container {
    height: 200px;
    width: 500px;
    border: 1px solid #eeeeee;
    margin: 30px;
    position: relative;
    font-family: Arial;
}

.block {
    position: absolute;
    height: 80px;
    width: 60px;
    background-color: #eeeeee;
    top: 10px;
    left: 10px;
    font-size: 36px;
    text-align: center;
}

.content {
    width: 410px;
    float: right;
    margin: 10px;
    font-size: 18px;
}