div右对齐不要保持在顶部

时间:2012-07-03 22:06:18

标签: html css

当中心div的内容非常广泛时,如何将红框保持在顶线? 当居中的div有很多内容时,红色div会转到另一行。 你知道为什么会这样吗?

看看我的代码: http://jsfiddle.net/5dC6T/3/

2 个答案:

答案 0 :(得分:2)

问题在于您订购了<div>元素。尝试:

<div>
    <div class="red-box"></div>
    <img class="photo" alt="" />
    <span>Name</span>
    <span>Data</span>
    <span>City</span>
</div>

CSS:

/* These two will stay anchored on the right and left */
.red-box { float: right; }
img.photo { float: left; }

我对您当前的代码进行了这些修改:http://jsfiddle.net/Wexcode/38qYS/

答案 1 :(得分:0)

使用此CSS:

#QuadroEvento div.TopoEvento div.euvou{
    height: 90px;
    width: 90px;
    background-color: red;
    position: absolute;
    right: 0px;
    margin-right: 0px;
}​

关键是:position: absolute;

您还可以使用position: fixed;等,有关详细信息,请参阅此处:http://www.w3schools.com/cssref/pr_class_position.asp