I tried to implement fixed position header bar. But when I try to resize

Question

0

Asked: June 13, 20262026-06-13T15:42:27+00:00 2026-06-13T15:42:27+00:00

I tried to implement fixed position header bar. But when I try to resize

0

I tried to implement fixed position header bar. But when I try to resize window to smaller width, right part of header is not shown.. If I changed position to absolute, problem is resolved but I’m losing the fixed effect of header bar..

#header {
position: fixed;
top: 0px;
display: block;
height:56px;
width: 100%;
padding-left: 0px;
background-color: #333333;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
z-index: 99999;
}

here is the html;

<body>
  <div id="mask"></div>
  <div id="wrapper">
    <div id="header">
        <div id="center">
            <a id="logoWrapper" href="/makale"><div id="logo"></div></a>
            <div id="categoryWrapper">

                <ul>
                   <li>...</li>
                   <li>...</li>
                 </ul>

            </div>
            <div id="searchWrapper">
                <div id="search">
                    <input type="text" />
                    <a id="searchBt" href="#"><img src="/images/site/search.png"></a>
                </div>

            </div>
        </div>
    </div>
    <div id="content">...</div>
  </div>
 </body>

Here is the link http://sporapp.com/makale