I've never dealt with CSS but now I have to. I'm developing some HTML code - a sketch of a website and have a problem with CSS. I would like to have my header in a fixed position, I mean it always should be on the top of the site, even if there is so much content that site has to be scrolled to see everything. I've tried somethig, but it does not work properly.
HTML:
if you still do not get it what I mean, here I provide links with fixed, witout fixed
Of course, what I'm looking for is nice a solution, without unnecessary code (even CSS and JS). It is important to note that no one element, especially header has not fixed height!
Answer
If I understand your problem correctly, you want to add the following CSS to your header to make it stay at the top of the page:
top: 0px;
Then, with div#content, give it a top margin to push it down out of the header's way:
margin-top: 200px;
So your CSS ends up looking like this:
header {
border: 2px solid red;
position: fixed;
width: 100%;
top: 0px;
}
#content {
border: 2px solid black;
margin-top: 200px;
}