html - Header overlaps other text / images -
i want if people scroll on page, header keep showing (logo + navigation bar). css code i'm using:
#header_bar { margin: 0 auto; width: 100%; background-color: #1f1d1e; height: 80px; position: fixed; top:0;
}
but happens now: http://puu.sh/6fixy.jpg
as see header overlaps image, how can fix this? i've tried using margin-bottom / padding-bottom, margin nothing while padding makes background box larger.
how can fix this?
supposing html structure looks like
<div id="header_bar">...</div> <div id="someotherdiv">...</div>
add margin-top
next element after #header_bar
#someotherdiv { margin-top:80px; /* 80px because #header_bar taking 80px in height. */ }
Comments
Post a Comment