Html 背景颜色和样式显示不正确

请看一看我的网站，我正试图让contentarea正确显示在三个景点框后面。我的css是：

#attractions {
    width: 290px;
    height: auto;
    display: block;
    padding-right: 20px;
    float: left;
}

这是我的主容器的代码：

#main {
    margin: 10px auto 0px;
    width: 950px;
    max-width:100%;
    background: none repeat scroll 0% 0% #FBFBFB;
    padding: 10px;
    background-color: #FFF;
    border: 2px solid #FFF;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.75);
}

---

当我移除浮动时：左；从#景点开始，并将其替换为显示：内联块；这是可行的，但我需要用float找出另一个解决方案：left；因此，这将在移动设备上正确浮动。有没有其他方法可以使contentarea样式显示在框后面

将

overflow:hidden

添加到#主选择器以清除浮动。要更详细地解释为什么会发生这种情况，请看这里：此解决方案非常有效，但不幸的是，我的情况并非如此。它隐藏了一些在#main之外的元素。还有别的选择吗？我想是的！谢谢！