Question

I Have site change.is, where right side menu & search bar in header is aligned to the background image grid (dark lines in body background image).

But when a page is having scroller then these right side menu & search is shifted to right.
Any solution for this.
page having scroller, http://change.is/video/david-oistrakh-debussy-clair-de-lune

Answer 1

I think what you are trying to achieve is hard to do as the scrollbar is a part of your browser windows and not a part of the document.

So when your header has the property width:100% it will be smaller with a scrollbar.

I can think only about these alternatives :

• Fix the width of the header but not great when you resize the windows.
• Put the content of your page in a div with fixed height, and only this part can be scroll, and your header is outside the div
• Based on this : How can I check if a scrollbar is visible? you can find out if your scrollbar is visible and change your header position if it’s visible

I hope it helps.