Shifting column


this is my first post to sitepoint and I’m hoping it makes sense.

I just completed and posted my new website and seem to have everything working. I am running into one issue with smaller monitors/browser windows.

My header is fixed so that the content will scroll under it when viewed, but the scrolling content section adds a horizontal scroll bar to the bottom of the window on small screens which then allows the content area to shift right or left out of alignment and I cannot seem to find the fix for this.

The site is and hopefully the attatched screen shots will help illustrate what I am talking about.

Am I just crazy in thinking I can keep this whole thing in alignment?


Hi mieche, welcome to SitePoint! :slight_smile:

It’s better to center your container like so:

#container {
	margin:0 auto;
	width: 750px;
	position: relative;

(I left position:relative in there in case it’s of relevance to the contents of the container, but it’s not needed to position the container itself.)

Thanks Ralph,

I’m not using the auto margins because I want to keep everything in line with my header which is fixed and won’t recenter with the page.