css - 为什么float right出现在float left的下方？

Question

我有一些导航链接，它们是图像按钮，我应用了 float: left，并且我有一个登录字段。我应用了 float: right 的登录字段出现在导航栏下方。如何将它们并排放置？

body {
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    color: #FFFFFF;
    font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif;
    background-color: #000000;
}

#wrapper {
    margin: 0 auto;
    width: 80%;
}

#top {
    border: medium dashed #F40408;
    text-align: left;
    width: 1500px;
}

#navigation { 
    -webkit-box-shadow: 0 0 20px 3px #E006F5;
    box-shadow: 00 0 20px 3px #E006F5;
    width: 1080px;
    height: 50px;
}

#navigation ul {
    list-style-type: none;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom:0px;
    margin-left: 0px;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
}

#navigation a {
    float: left;
}

#login {
    float: right;
}

谢谢，迈克

Answer 1

有点难以想象，因为没有提供 html 代码，但我认为尝试向其中添加 position: absolute 并且您使左/右浮动的计划将正常工作。