嵌套DIV定位不正确

时间:2010-08-24 07:00:43

标签: html css

下面的代码应该(?)将#inner1和#inner2放在同一个位置,或者不应该这样?

无论如何,#inner1和#inner2的位置不同,尽管有相同的父级。如何解决这个问题(位置在同一位置)?

<html>
<head>
<style>
div {border:1px dotted}
#main {width:800px;height:600px;position:absolute;}
#outer {width:600px; height:400px; position:absolute; top:100px; left:100px}
#inner1 {position:absolute;right;5px;bottom:5px;height:200px;width:200px}
#inner2 {position:absolute;right:5px;bottom:5px;height:200px;width:200px}
</style>
</head>
<body>
<div id=main>
main
<div id=outer>
outer
    <div id=inner1>
    inner1
    </div>
    <div id=inner2>
    inner2
    </div>

</div>
</div>
</body>
</html>

2 个答案:

答案 0 :(得分:1)

right;5px;

中的

#inner1

语法错误。 (分号而不是冒号)

答案 1 :(得分:0)

你正在使用position:absolute为每个分区,在外部分区内有两个分区你应该使用position:relative;