Thursday, January 6, 2011

Setting a Fixed Width in SharePoint 2010

This needs to blogged about once again, since it seems to be an ongoing issue with SharePoint skinning.

This post will show how to easily go from the default liquid layout, to a 960px width with auto scrolling.
Step 1. Alter the Body Tag – replace scroll="no” with style="overflow:auto;”
(This will allow the Body to have a scroll bar when needed.) 
Step 2. Add the below <div> tag directly after the <body> <form> tags
 <div style="width:960px; margin:auto;”>

 

Step3. Don’t forget to add the closing </div> tag directly after  
<SharePoint:DeveloperDashboard runat="server"/> around line 625




Thats it, Save your master page and refresh your SharePoint... you now should have a fixed width
Published with Blogger-droid v1.6.5

1 comment:

  1. **Update: Found a CSS only solution. This is much cleaner then the original above post.

    However this CSS fixed width is only applied when the Ribbon Bar is hidden for anonymous access. (does not fix width the ribbon bar)

    Ignore the above post and use the following CSS:

    #s4-bodyContainer > div {
    width: 1000px;
    margin-left: auto;
    margin-right: auto;
    float: none;
    }

    body #s4-titlerow > div {
    width: 1000px;
    margin-left: auto;
    margin-right: auto;
    float: none;
    }

    ReplyDelete