Twitter的bootstrap结构与divs

Question

我想知道是否可以将该条移动一点，条形图包含<p>标记。

<div class="span9 well">
<div class="row-fluid">
    <div class="row-fluid">
        <div class="span2">
            <img src="dummy_image.jpg" class="img-polaroid">
        </div>
        <div class="span7">
            <h2>Title</h2>      
            <p>Texttttttttttttttttt.</p>
            <p >
                <a href="#"><span class="label label-info">Genre</span></a>
                <span class="label label-warning">
                <i class="icon-star"></i>
                ...<!-- stars -->
                </span>     
                <a href="#"><span class="label label-success">Yes</span></a> / <a href="#"><span class="label label-important">No</span></a>
            </p>
        </div>
    </div>
</div>

我要更改的实际块的屏幕截图：

Answer 1

您可以随时为<p>标记命名：

<p class="bar">
    <a href="#"><span class="label label-info">Genre</span></a>
    <span class="label label-warning">
    <i class="icon-star"></i>
    ...<!-- stars -->
    </span>     
    <a href="#"><span class="label label-success">Yes</span></a> / <a href="#"><span class="label label-important">No</span></a>
</p>

然后在你的css代码中使用.bar {margin-top: 20px;}，这是不错的行为

Answer 2

使用position:absolute

.row-fluid{position:relative; width:450px; background:red; overflow:auto}
.span2{display:inline; float:left}
.span7{display:inline; }
.row-fluid > p{position:absolute; bottom:0; left:170px}​

<强> DEMO