如何自动设置div高度以适应内容？

Question

在我的脚本中，所有内容都是从数据库加载的。它基本上是一个页面，它从数据库中检索其信息，具体取决于单击的URL。内容被放入div中。所以div的高度应该自动增加，以适应内容。有了我现在的代码，它没有。它显示了所有内容，但div保持一个大小。我该如何解决这个问题？

<div class="grid-item grid-item--width100 container">
        <div class="img"><i class="fa fa-wrench fa-3x"></i></div>
        <div class="innerContainer">
            <font class="txt_registerB">Updates</font><font class="txt_registerN"></font>
            <br><br>
            //Content here
            <br>
        </div>
  </div>

CSS

.container {
    background-color: #FFFFFF;
}

.innerContainer {
    position: absolute;
    top: 15px;
    left: 15px;
    text-align: left;
    padding-right: 15px;
}

.img {
    text-align: right;
    padding: 15px;
    color: #000;
    opacity: 0.3;
}

.grid-item {
    min-width:160px;
    float: left;
    margin-bottom: 10px;
}

.grid-item--width100 { 
    width: calc(100% - 40px); 
}