-1

在此处输入图像描述

我想要箭头结束位置的红色框。jsbin

<div id="wrapper">
<div id="blue"></div>
<div id="yellow1">y</div>
<div id="yellow2">y</div>
<div id="red"></div>
</div>


body{width:800px;}

#wrapper{position:relative;}

#blue{
float:left;
height:225px;
width:520px;
background:blue;
}

#yellow1,#yellow2{
position:relative;
width:250px;
height:200px;
margin:10px 0 20px 540px;
background:yellow;}

/*Not working*/
#red{
background:red;
position:absolute;
height:200px;
width:520px;
top:200;  
}
4

5 回答 5

2

#red 的 top:520 是错误的。你必须写 top:230px 作为我认为的最高值..

于 2013-11-05T10:38:47.027 回答
1

您在#red 规则末尾缺少一个度量单位top:520;它应该像top:520px;

于 2013-11-05T10:41:01.587 回答
0

删除并top写入margin-top:-195px.#red

演示在这里。

于 2013-11-05T10:40:52.300 回答
0

使用此代码

http://jsbin.com/IxAtOFA/10/edit

#blue{
    float:left;
    height:225px;
    width:520px;
    background:blue;
  margin:5px;
}

#yellow1,#yellow2{
position:relative;
width:250px;
height:200px;
background:yellow;
float:right;
    margin:5px;
}

#red{
  background:red;
  height:200px;
  width:520px;
  float:left;
    margin:5px;
}
于 2013-11-05T11:15:49.757 回答
0

现在解决了,我把黄色<div id="red"></div>放在前面,http://jsbin.com/IxAtOFA/12/edit divs

于 2013-11-06T04:53:56.190 回答