css任何定位,CSS定位绝对绝对

修改

当我使用正确的“0”设置.list时，其余的定位是自动...因为我正在为响应式布局开发这个，我的容器将没有固定的高度，宽度..所以我需要使用jQuery获取职位，

e.g. $("#btnHideList").css({ 'right': .. based on position of list

same with top or bottom

我正在尝试创建一个列表，其左下角附有一个hideMe按钮，但我无法弄清楚我可以在这里使用哪种CSS技术。

HTML

ClickMe

my list

Hide

JS

$("#clickMe").on("click", function() {

$("#btnHideList").show();

$(".list").show("slide", { direction: "right" }, 3000);

});

CSS

.container {

position:relative;

top:20px;

left:20px;

width:600px;

height:600px;

border-left:10px dashed darkgreen;

background-color:green;

height:800px;

padding-left:40px;

}

.list {

display:none;

position:absolute;

right:0;

background-color:blue;

width:300px;

height:300px;

}

.btn {

position:absolute;

background-color:yellow;

width:100px;

height:100px;

}

#btnHideList {

display:none;

position: absolute;

width: 100px;

right: 0px;

background: rgb(117, 231, 117);

top: 300px;

border-radius: 5px 0px 0 5px;

color: #fff;

text-align: center;

padding: 40px 0;

cursor:pointer;

}

期待这个，