Question

我有一个容器里面有2个div。一个采用容器的左侧，第二个（rightBarItems）应该位于右侧，但我希望它的高度与Container的高度相同。基本上，我正在创建一个右侧的列。

HTML：

<div class="container">
        <div class="itemMain"><?php include("itemMain.php"); ?></div>
        <div class="rightBarItems"><?php include("rightBarItems.php"); ?></div>
</div>

CSS：

.container {
    overflow: hidden;
    background: white;
    padding-right: 20px;
    -webkit-box-shadow: 4px 2px #492409,  -4px 0 2px #492409;
    -moz-box-shadow: 4px 0 2px -6 #492409,  -1px 0 2px #492409;   
    box-shadow: 4px 0 2px  #492409,  -4px 0 2px #492409;
}

Answer 1

两种解决方案（两者都有问题）

第一个：

1）相对于容器的位置 2）并浮动左边的元素。 3）将绝对右侧元素放置并设置其顶部：0和底部：0，右侧和宽度

当然，问题在于左侧的cotainers内容应该大于正确的内容

第二个（如果你可以在html中添加更多元素）： 1）相对于容器的位置 2）浮动右侧和左侧容器 3）创建一个新的div，它是正确元素的“bg” 4）位置绝对与前一个相同：right：0，top：0，bottom：0和width 5）必要时调整z-index

：o

编辑：

后一种解决方案的快速样本：http://jsbin.com/ecaced/1

Answer 2

height: auto;或height: 100%;应该有效。

右侧的CSS列，与容器的高度相同

2 个答案: