header - 定位页面

Question

我想创建一个类似于 facebook where position:fixed 的标题。当你缩小整个页面中心时，当我放大标题时，标题也会拉伸。当我使用位置：固定和放大时，由于窗口空间不足，某些内容会消失。

<div id="header_line" ></div>
<div id="header">
  <div id="heading_name" ><a href="home.php">Home</a> </div>

<div id="heading_name" style="left:28%;">Advertisement Board</div>
<div id="heading_name" style="left:46%;">Advertise</div>
<div id="heading_name"  style="left:60%;">Sign In</div>
<div id="heading_name"  style="left:76%;">About Us</div>



</div>

<style>


#header_line{
    position:fixed;
    top:0%;
    left:0%;
    width:1370px;
    height:7px;
    z-index:20;
    background-color:#F60;
}
#header{
    position:fixed;
    left: 0px;
    z-index:20;
    top: 7px;
    width:1370px;
    height: 30px;
    background-color:#003;
    border-bottom:thick;
    border-bottom-color:#000;
    box-shadow:2px 5px 5px 1px #033;

    }

</style>