在绝对定位的div上折叠页边距？

Question

我有4个div的总数：

1个容器1个子菜单1个内容1侧边栏

它们是这样设置的：

<container>
     <submenu></submenu>
     <content></content>
     <sidebar></sidebar>
</container>

容器具有position:relative和overflow:hidden

子菜单和内容具有浮动:左侧边距用于定位

侧边栏绝对位于右侧(浮动将不起作用，因为子栏会影响布局。

我有一些图片是在侧边栏中垂直列出的，但它们被容器切断了。如果我浮动或将位置设置为相对，它将包含正确的侧边栏。我试过在侧栏后的一个明显的修复，但这不起作用。

这是我经常看到的问题之一。有什么建议吗？

-编辑

<div id="content">
    <div id="submenu">
    </div>
    <div id="contentBox">   
    </div>
    <div id="sidebar">
    </div>
</div>

#content
{
    margin: -22px auto 0 auto;
    overflow: hidden;
    padding: 0 10px 10px 10px;
    position: relative;
    text-align: left;
    width: 961px;
}

#submenu
{
    background-color: #001a28;
    border: 5px #008da8 solid;
    float: left;
    margin: -20px 0 0 -10px;
    padding-top: 20px;
    width: 700px;
}

#contentBox 
{
    background-color: #ffffff;
    float: left;
    margin: 10px 0 10px -10px;
    width: 710px;
}

#sidebar
{
    border-left: 5px #008da8 solid;
    border-right: 5px #008da8 solid;
    background-color: #ffffff;
    display: block;
    height: 100%;
    position: relative;
    float: right;
    text-align: center;
    right: 10px;
    top: -10px;
    width: 207px;   
}

Answer 1

我还没有找到一种简单的方法来使div达到父元素高度的100%。我已经能够在过去作弊:我不是试图使拉伸达到100%的高度，而是在中使用垂直背景拉伸，在侧边栏所在的位置创建一个条纹，并使bg-透明。这样，无论高度是多少，总会有一个错觉，那就是它是高度的100%。

一旦你有了它，只要确保你的图片没有像你所描述的那样被裁剪，它应该是相同的效果。不过，如果不了解更多你想要实现的目标，我不知道这对你是否有用。希望这能有所帮助！