如何获取固定标头来覆盖 PHP 生成的表

我目前正在开发一个供私人使用的博客，并且已经到了核心博客工作的地步，省去一个美学问题，使其看起来不整洁。

主页有两个主要部分：一个固定的标头，其中包含标题和菜单子元素。PHP 生成的表，显示来自 sql 数据库的帖子。

问题是，当向下滚动页面时，标题旨在与表格重叠并保持在顶部以保持整洁，尽管我无法让它这样做。

这是目前写的内容，你能告诉我你的想法和我的问题的可能解决方案吗？

PHP 在表中显示 sql 结果：

    <div id="cwrapper" style="margin:0px auto; margin-top:125px; margin-bottom:25px; width:600px; height:auto; border-top:1px solid #1E1E1E; border-bottom:1px solid #1E1E1E; z-index:-1;">
<?php
    $con = mysqli_connect("localhost","root","","db_posts");
    // Check connection
    if (mysqli_connect_errno()){
        echo "Failed to connect to MySQL: " . mysqli_connect_error();
    }
    $result = mysqli_query($con,"SELECT * FROM tb_posts ORDER BY id DESC LIMIT 3");

    echo "<table cellpadding='0' cellspacing='0' border='0' id='posttable' style='z-index:-1;'>"; 
    while($row = mysqli_fetch_array($result)){
        echo "<tr><td class='postcell' style='z-index-1;'>" . $row['post'] . "</td></tr>";
    }         
    echo "</table>";
    mysqli_close($con);
?>
</div>

固定标头：

    <div id="header">
    <div id="styletext">
        <h1 id="headtext">
            TheNotsoGentleman
            <a href="newpost.php" style="text-decoration:none; color:#000; margin-left:-15px;">.</a>
        </h1>
    </div>
    <div id="menu" style="position:fixed; top:25px; right:20px;">
        <ul>
            <li class="menuitem"><a href="index.php" class="menutext">Blog</a></li>
            <li class="menuitem"><a href="info.php" class="menutext">Info</a></li>
            <li class="menuitem"><a href="downloads.php" class="menutext">Downloads</a></li>
        </ul>
    </div>
</div>

造型：

#header{
    position:fixed;
    left:0px;
    top:0px;
    height:75px;
    width:100%;
    background-image:url(../assets/pictures/trinet_background.png);
    background-repeat:repeat;
    border-bottom:1px outset #666;
    box-shadow: 0px 7px 8px #888888;
}
#styletext{
    position:fixed;
    top:5px;
    left:10px;
    width:auto;
    height:auto;
    min-height:30px;
}
#headtext{
    font-family:official;
    font-size:42px;
    font-style:bold;
    font-weight:normal;
    text-align:center;
}
#posttable{
  width:600px;
  height:auto;
  margin-top:10px;
  margin-bottom:10px;
  z-index:-1;
}
.postcell{
  width:600px;
  height:auto;
  padding-bottom:20px;
  padding-top:20px;
  padding-left:5px;
  padding-right5px;
  border-bottom:1px dashed #333;
  opacity:0.5;
  -webkit-transition:linear 0.2s;
  -moz-transition:linear 0.2s;
  -o-transition:linear 0.2s;
  transition:linear 0.2s;
  z-index:-1;
}
.postcell:hover{
  opacity:1;
  z-index:-1;
}
#newpost{
  position:fixed;
  top:100px;
  left:100px;
  height:500px;
  width:500px;
  background-color:#FFF;
  border:1px solid #000;
  visibility:visible;
  z-index:-1;
}
.menuitem{
  text-decoration:none;
  list-style:none;
  color:#000;
  display:inline-block;
  margin-right:20px;
}
.menutext{
  text-decoration:none;
  color:#999;
  font-size:24px;
  font-family:monospace;
  -webkit-transition:linear 0.6s;
  -moz-transition:linear 0.6s;
  -o-transition:linear 0.6s;
  transition:linear 0.6s;
}
.menutext:hover{
  color:#000;
}

提前感谢任何帮助/建议。