Does anyone have 960 Grid Template to be used on sharepoint 2010 site?

Question

I am working on design of portal in sharepoint 2010. I need to implement 960 grid system there.It will be very helpfull if anybody have template or related link to it.

Answer 1

Here is a nice walk thru by Dwight Goins:

http://dgoins.wordpress.com/2011/07/07/the-960-grid-in-sharepoint-made-easy/

He uses a CSS file to "reset" some default settings:

<style type="text/css">

        /* fix scrolling on list pages */

        #s4-bodyContainer {

            position: relative;

        }



        /* hide body scrolling (SharePoint will handle) */

        body {

            height:100%;

            overflow: scroll;

           /* comment out width because we're using 960px instead */

           /*width:100%;*/

       }

       </style>

He then placed the default content in a containing and started his design.

The falling pitfalls are called out:

1. When working with page layouts, if you’re not cognizant of the fact that your master page is using the 960 grid your layout will yield nasty vertical and horizontal scroll bars.

2. When editing the page, if you place the web part adder and it’s corresponding controls in their normal positions, the runtime web part design experience becomes non-existent. Basically it becomes practically impossible to add, edit and remove web parts because their may not be any scroll bars and the design time controls flow off the page.

3. Attempting to do this for the System Master pages is also impossible for the same reasons mentioned above, and the mere fact that system pages were designed to use the whole width of the page {width: 100%}. Leaving anything off would severely hinder system admin functionality.