css - 奇怪的分区定位

Question

我创建了三个我想从左到右显示的 DIV。

<div id="middle">
     <div id="middleleft"></div>
     <div id="middleleftopenclose"></div>
     <div id="middleright"></div>
</div>

但是，DIV middleleftopenclose 一直出现在左侧，而不是在 middleleft 之后。这是为什么？

#middle {
    position: relative;
    height: 100%;
}
#middleleft {
    width: 445px;
    float: left;
}
#middleleftopenclose {
    background-color:#2a2729;
    position: absolute;
    height: 100%;
    width: 15px;
    float: left;
}
#middleright {
    height: 100%;
    margin-left: 460px;
}

谢谢!

Answer 1

float 不适用于 position: absolute。 尝试将其更改为 position: relative;

#middleleft {
    width: 445px;
    float: left;
    position: relative;
}
#middleleftopenclose {
    background-color:#2a2729;
    position: relative;
    height: 100%;
    width: 15px;
    float: left;
}