CSS包装器和容器Div自动高度？

Question

I want div in div height set auto.

http://bit.ly/rubikss1

at the bottom of the div inside is coming out. I want the bottom div to extend to.

Please Help!

 body,html{height:100%} .wrapper{ width: 700px; height: 100%; margin: 25px auto; overflow:hidden; position: relative; } .inner-container{ width: 100%; height: 100%; float: left; border-radius: 5px; background: rgba(255,255,255,.5); position: relative; } .button-container{ float: left; width: 100%; height: 35px; position: absolute; z-index: 2; } #prev, #next{ border: 0; background: #5CB85C; padding: 5px 10px; color: #fff; border-radius: 2px; cursor: pointer; font-size: 18px; } #next{ float: right; } #prev{ float: left; } #verilistesi{ float: left; width: 700px; height: 100%; position: relative; overflow: hidden; } #verilistesi .item-container{ width: 100%; float: left; } #verilistesi .item-container .item{ width: 500px; height: 100%; background: rgba(0,0,0,.3); margin-bottom: 35px; margin-top: 50px; position: relative; overflow: hidden; } 

My css.

How i do set auto height two div? Please give help?

Answer 1

I think that is what you want:

        body,html{height:100%}

        .wrapper{
            width: 700px;
            height: auto;
            margin: 25px auto;
            overflow:hidden;
            position: relative;
        }

        .inner-container{
            width: 100%;
            height: auto;
            float: left;
            border-radius: 5px;
            background: rgba(255,255,255,.5);
            position: relative;
        }

        .button-container{
            float: left;
            width: 100%;
            height: 35px;
            position: absolute;
            z-index: 2;
        }

        #prev, #next{
            border: 0;
            background: #5CB85C;
            padding: 5px 10px;
            color: #fff;
            border-radius: 2px;
            cursor: pointer;
            font-size: 18px;
        }

        #next{
            float: right;
        }

        #prev{
            float: left;
        }

        #verilistesi{
            float: left;
            width: 700px;
            height: auto;
            position: relative;
            overflow: hidden;
        }

        #verilistesi .item-container{
            width: 100%;
            float: left;
        }

        #verilistesi .item-container .item{
            width: 500px;
            height: 100%;
            background: rgba(0,0,0,.3);
            margin-bottom: 35px;
            margin-top: 50px;
            position: relative;
            overflow: hidden;
        }