向右浮动仅在 window 调整大小后有效

Question

简直无法理解！我在右侧 (DIV1) 有一个 div，在左侧 (DIV2) 旁边有另一个 div，我想将一些元素放在 DIV2 中右对齐。
这是图片：

这是 HTML :

<section id='main-container'>
    <aside id='main-side'>

    </aside>
    <nav id='main-nav'>
        hello
    </nav>
    <section id='main-content'>

    </section>
</section>

和 CSS :

#main-side {
    width:250px;
    min-height:450px;
    border:1px solid silver;
    float:right;
}
#main-nav {
    width:770px;
    height:50px;
    text-align:right;
    border:1px solid silver;
    margin-right:251px;
}

问题如图所示，当我打开页面或重新加载页面时，DIV2 的内容没有向右移动，但是当我调整 window 的大小时，它向右移动如我所料。顺便说一句，浏览器是 Chrome，问题不在 Firefox 中。知道有什么问题吗？

Answer 1

当我从您的站点对其进行测试时，我遇到了同样的问题。通过从您的 #main-nav 部分中删除 width: 770px;，我能够使其正常工作。

向右浮动仅在 window 调整大小后有效

Float right only works after window resize

html

css

alignment

css-float

window-resize