html - 使用内容拉伸(stretch)相对定位的 DIV

Question

我有以下 CSS 可以使我的页面居中

#mainholder {
    position:relative;
    margin-left:auto;
    margin-right:auto;
    width:1000px;
    background-color:#FFFFFF;
    min-height:1100px;
    z-index:1;
    clear:both;
}

在#mainholder div 中，我有另一个 DIV，其中包含我的数据，这些数据将根据内容增加或减少高度。 CSS在下面

#maincontentdiv {
    position:absolute;
    width:955px;
    min-height:795px;       
    border-style:solid;
    border-width:thin;
    border-collapse:collapse;
    left:10px;
    top: 135px;     

}

我遇到的问题是，虽然#maincontentdiv 按预期拉伸(stretch)，但#mainholder 不会随着#maincontentdiv 的内容拉伸(stretch)。我想知道如何解决这个问题或者还有哪些其他选择。

所有帮助将不胜感激 谢谢

编辑

根据要求，这是HTML代码

<div id="mainholder">
  <div id="topnavbar">
    <div id="navlinks">

    </div>

  </div>
  <div id="messagediv">

  </div>
  <div id="maincontentdiv">
    <table width="100%" border="0">
      <tr bgcolor="#507CD1">
        <td width="19%">Grant ID</td>
        <td width="61%">Grant Description</td>
        <td width="20%">Manage</td>
      </tr>
      <?php 
      $select = " SELECT QUERY THAT WILL CHANGE THE LENGTH OF THE DIV DEPENDING ON RESULTS

";
     $query = sqlsrv_query($conn,$select,array(),array("Scrollable"=>SQLSRV_CURSOR_STATIC))or die(print_r(sqlsrv_errors()));
     while($row=sqlsrv_fetch_array($query))
     {
        //variables
       ?>
      <tr>
        <td><?php echo $variable ?></td>
        <td><?php echo $variable ?></td>
        <td>&nbsp;</td>
      </tr>
      <?php }?>
    </table>
  </div>
  <br style="clear:both"/>
</div>

Answer 1

你的内部 div 有 position:absolute。所以它的位置不会影响父div。

#maincontentdiv {
    position:absolute;
    width:955px;
    min-height:795px;       
    border-style:solid;
    border-width:thin;
    border-collapse:collapse;
    left:10px;
    top: 135px;     

}

将此更改为

#maincontentdiv {
    position:relative;
    width:955px;
    min-height:795px;       
    border-style:solid;
    border-width:thin;
    border-collapse:collapse;
    margin-left:10px;
    margin-top: 135px;     
}

如果您还有问题，请告诉我。