右浮动仅在窗口调整大小后有效答案

【问题标题】：Float right only works after window resize右浮动仅在窗口调整大小后有效
【发布时间】：2015-03-27 18:08:00
【问题描述】：

简直无法理解！我在右侧 (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 的内容不会向右移动，但是当我调整窗口大小时，它会像我预期的那样向右移动。顺便说一下，浏览器是 Chrome，问题不在 Firefox 中。知道有什么问题吗？

【问题讨论】：

您的 CSS 中是否有其他内容导致样式被覆盖？测试您在我的浏览器中粘贴的内容，效果很好。
这里我上传了文件和css你可以查看源代码：brandmap.ir/files/issue
知道了，正在查看。
尝试快速从您的#main-nav 中删除width: 770px;。
不客气，我也将其作为答案发布，以便其他人如果不阅读此处的 cmets 即可解决。

标签： html css alignment css-float window-resize

【解决方案1】：

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

【讨论】：