Fixed Width Master Pages in SharePoint 2010

Note: This post is about the beta and is out of date. See this post, SharePoint 2010 Fixed Width Master Pages Revisited, for an approach that works better with the release version.

Edit: Since I wrote this post I found this one which has a solution I like better: http://styledpoint.com/blog/fixed-width-centered-sharepoint-2010-site/. I also recommend you take a look at Randy Drisgill’s starter master pages which you can read about here: http://blog.drisgill.com/2009/11/starter-master-pages-for-sharepoint.html.

I spent the last couple of hours attempting to make a fixed width master page for a 2010 project we’re working on. Everything was great except for the fact that I couldn’t get the scroll bars for the page to display! So, I started over testing as I went and the scrollbars disappeared as soon as I removed a certain <div>.

<div id="s4-workspace">

However, as soon as I added the div back, the scrollbars appeared, but my nice 960 px layout aligned to the left instead of centering. I looked at the CSS for this element, but saw nothing that should have the effect I was seeing and certainly nothing that should have made the scrollbars appear and disappear. After spending too much time fooling around with the CSS it occurred to me to look at the javascript. I used grep on the 14 hive looking for s4-workspace and it found a match in init.js.

Now init.js like the rest of the *.js files is minified, so I used this website – http://javascript.about.com/library/blformat.htm – to reformat the script to make it readable. A quick examination showed that I needed to add another class to the div as so (the final page will not have the inline style attribute but will instead use an additional class name):

<div id="s4-workspace" class="s4-nosetwidth" style=" margin-left: auto; margin-right: auto; width: 970px; background: url(/SiteAssets/PageBackground.png) no-repeat white;">

I had to make the div a little wider than what I wanted to avoid a horizontal scrollbar. I’ll figure that minor issue out later.

Author: Doug Ware