I'm having issues with creating a fixed header for my webpage. It seems to be hiding behind the rest of the content on the screen even though I have tried adjusting the z-index without success.
Here is a snippet of my HTML code:
body {
margin: 0;
}
.header {
width: 100%;
height: 88px;
position: fixed;
left: 0;
top: 0;
}
.content {
margin-top: 100px;
}
/* More CSS styles here */
<div class="header">
<h1>HEADER</h1>
</div>
<div class="content">
<div class="first-sec">
</div>
<div class="second-sec">
</div>
<div class="third-sec">
</div>
<div class="fourth-sec">
</div>
</div>Can anyone help me figure out what I am doing wrong in my code?