CODEWITHSUNDEEP
htmlcsspositionfixed
Phill Collins
Phill Collins

Reputation: 183

Positioning fixed header

This is a tricky one, for me at least. I have a page that needs to scroll horizontally. At the top of the page is a menu that needs to stay in the same place the whole time centered on the page. Even if I were to use jQ I am unsure how to achieve this as it appears I need to position the same div two different ways.

Here is the page:

http://www.coflash.com/testing/raycollins/gall1.php

The scrollbar is not appearing for some reason either, but works fine in the old code on this site:

http://www.raycollinsphoto.com

Any ideas?

Upvotes: 2

Views: 910

Answers (1)

Sotiris
Sotiris

Reputation: 40036

For the scroll add in body overflow-x:scroll; This will show the horizontal scroll bar.

About the header you can use position:fixed; and width:100% and z-index:10; so the final css for #headerwrap will be:

#headwrap {
    background-color: #1C1C1C;
    position: fixed;
    width: 100%; /* to take the width of all screen */
    z-index: 10; /* In small screens the images override the header */
}

Upvotes: 3

Related Questions