[英]nested divs within a div wont overlay
I have a few nested divs, an outer, then a page wrapper and then two divs inside the page wraper. 我有几个嵌套的div,一个外部,然后是一个页面包装器,然后在页面包装器内部有两个div。 the two divs in there are generated and added to the page wrapper.
其中的两个div生成并添加到页面包装器中。 if the 2 divs have the same top and left values the divs dont over lap but wrap below the previous div.
如果2个div的顶部和左侧值相同,则div不在圈上,而是环绕在前一个div以下。 attached is the code i have so far.
附件是我到目前为止的代码。 i need the 2 divs in the page wrapper to not wrap like it is.
我需要页面包装中的2个div不能像它那样包装。
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<style>
.outer-container
{
overflow:auto;
height:900px;
width: 900px;
border:1px solid black;
background-color:yellow;
padding:5px;
}
#page-wrapper { width: 800px; height:700px; border:2px solid #ccc; padding: 0px; background-color:white; position:relative }
</style>
<div class="outer-container">
<div id="page-wrapper" >
</div>
</div>
<script>
classvalue = "draggable ui-widget-content divimage";
idvalue= "div1";
thisdiv = '<div style="height:100;width:100;background-color:blue;top:1;left:1;z-index:0;margin:0px" id="'+idvalue+'" class="'+classvalue+'"></div>';
$('#page-wrapper').append(thisdiv);
idvalue= "div2"
thisdiv2 = '<div style="height:100;width:100;background-color:teal;top:2;left:2;z-index:1" id="'+idvalue+'" class="'+classvalue+'"></div>';
$('#page-wrapper').append(thisdiv2);
</script>
If I understood it right you want the 2 generated divs to overlap? 如果我理解正确,那么您希望生成的2个div重叠吗? Just add
position:absolute;
只需添加
position:absolute;
to those divs. 给那些div。
And don't forget to put a unit (px) to your top/left/width/... 并且不要忘记在您的上/左/宽/下放一个单位(px)...
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.