Fixed width, centered SharePoint 2010 Site
I was faced with the challenge of creating my first fixed width SharePoint site and the content had to be centered!
SharePoint 2010 implements a complicated system of divs, css and JavaScript to attain their static ribbon at the top of the screen but unfortunately this can get messy with different layout types.
In the master page remove the s4-workspace ID from the the div. This is the ID the java script looks for to resize the content.
Second, add the following to your branding css file or a style tag in the header after the core.css
/* Page Wrapper */
body{
overflow:auto;
}
form
{
width:950px;
margin-left:auto;
margin-right:auto
}
That’s it!
The fixed width gets centered by the auto margins and the page properly shows the scroll bars because of the overflow:auto!
January 7th, 2010 at 11:12 pm
[...] 1:38 PM Body: 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 [...]
January 20th, 2010 at 5:27 am
You solved my puzzle, thnxs.
Do you think it would also be possible to edit the Java Script for resizing?
January 21st, 2010 at 8:35 am
I don’t believe it would be so much of editing the script as turning it off completely and writing your own.
You can turn off most that functionality by removing some ID’s on some elements.