无法理解为什么div不填充父div？

Question

我有下一个HTML：

<div class="content">
        <div class="page">
        </div>
        <div class="sidebar">
        </div>
</div>

和css：

.content {
    position: relative;
    width: 90%;
    margin: 100px auto 30px auto;
}

.page {
    float: right;
    border-color: orange;
    border-style: double;
    border-width: 40px;
    border-image: url("images/bg_paper.png") 42 fill repeat;
    padding: 10px;
    margin-right: 250px;
}

.sidebar {
    position: absolute;
    right: 0;
    background-color: red;
    width: 200px;
    min-height: 70px;
}

带有div类的

page按内容换行但我需要填充父宽度，sidebar宽度除外。也许这很容易，但在CSS中的Imma noobie。
附：对不起我的英语不好。

Answer 1

这就是你所需要的一切

.content {
    position: relative;
}

.page {
    margin-right: 250px;
}

.sidebar {
    position: absolute;
    top: 0;
    right: 0;
    width: 200px;
}

Answer 2

在您的代码中，您说内容宽度= 90％。在这90％中，你希望你的.page div向右浮动，这意味着它的左边界以90％的50％开始。你应该删除float：right并根据你的意愿设置侧边栏的宽度。您的代码如下所示：

.content {
position: relative;
width: 90%;
margin: 100px auto 30px auto;
}

.page {
    border-color: orange;
    border-style: double;
    border-width: 40px;
    border-image: url("images/bg_paper.png") 42 fill repeat;
    padding: 10px;
    margin-right: 250px;
}

.sidebar {
    position: absolute;
    right: 0;
    background-color: red;
    width: 200px;
    min-height: 70px;
}

这应该做。