小编Bur*_*E99的帖子

我目前的问题是我有三个div元素; 一个漂浮在左边,一个漂浮在右边,一个漂浮在这两个之间.我希望中心div自动拉伸到两个div之间可用宽度的最大宽度.

HTML

<div id="contain">
    <div id="left">1</div>
    <div id="filler"></div>
    <div id="right">2</div>
</div>

CSS

#left {
    text-decoration: none;
    display: inline-block;
    float: left;
    width: auto;
    padding: 0px 20px 0px 20px;
    height: 45px;
    text-align: center;
    line-height: 300%;
    background: #FF9000;
    color: #FFFFFF;
}
#navFiller {
    display: inline-block;
    position: fixed;
    float: left;
    width: auto;
    height: 45px;
    background: #FF9000;
}
#right {
    text-decoration: none;
    display: inline-block;
    float: right;
    width: auto;
    padding: 0px 20px 0px 20px;
    height: 45px;
    text-align: center;
    line-height: 300%;
    background: #FF9000;
    color: #FFFFFF;
} …

我正在开发一个webapp,需要将div推到另一个绝对定位的div的底部.我尝试过bottom: 0并且vertical-align: bottom两个都没有工作.有没有办法将div移动到其父div的底部使用我可能没有想过的CSS或者可以使用JavaScript完成的某种解决方法？

#wrapper {
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background: rgba(0,0,0,0.5); 
	z-index: 1000;
}
#outer {
    margin-left: 12.5%;
    margin-right: 12.5%;
    margin-top: 5%;
    margin-bottom: 5%;
    width: 75%;
    height: 75%;
    background: rgb(0, 0, 0);
    z-index: 1001;
}
#a {
    position: absolute;
    width: inherit;
    height: 100%;
}
#inner {
    bottom: 0;
    background-color: white;
}
.invert {
    color:white;
}
.revert {
    color:black;
}
.text-center {
    text-align:center;
}

<div id="wrapper">
    <div id="outer" class="invert">
        <div id="a"> …