Which CSS framework(s) work well with SharePoint publishing sites?

Question

Past, now irrelevant back story: I was trying to make some changes to BlueBand and get 'up and running pretty quickly' but after looking at it further this is no longer an option due to tables that a previous developer introduced into the layout. I'll have to live with this and make what tweaks I can.

So, looking towards future greenfields projects...

Are there any recommendations for CSS frameworks that work nicely with SharePoint publishing sites? (Examples are BluePrint, YUI.) They should not interfere with standard out-of-the-box controls such as the Site Actions menu, rich text editor, and publishing toolbar.

Real world experiences welcomed, please!

Answer 1

What would you like to use a CSS framework for? As far as I can tell you could use one for making a cross-browser reset but everything else just depends on your layout. If you're planning to throw out the standard SharePoint layout it means that you need to start from scratch. The good news is that it's not much different than creating a layout for any other website. There are some things you need (http://msdn.microsoft.com/en-us/library/aa660698.aspx) while working with SharePoint but as for CSS it's all up to you.

Answer 2

Heather Solomon has a great blog/guide on wiring up SharePoint CSS classes - take a look:

http://www.heathersolomon.com/content/sp07cssreference.htm

Cheers,

Adam

Answer 3

You will run into a lot of trouble trying to hack the blue band theme into a table less layout.

You may get some mileage from the free Accesibility Kit for Sharepoint. It comes with layout pages, CSS and even control adapters for those who care about the HTML of thier site.

Still, getting rid of the tables produced by SharePoint is not really compatible with "up and running pretty quickly"

Answer 4

You should start with the minimal masterpage. That will be the masterpage that's connected to the publishing layouts. You can then add in all the html/css you desire to your masterpage and layouts to make them look like anything you want.

If the users who are browsing those same publishing pages also need access to your list forms (new,edit,display) you will have to edit those files and attach them to your masterpage (either through SP Designer or a Feature to do it automatically). Or, customize the application masterpage to be nearly the same as your publishing masterpage and deploy them both as a feature with an HTTP Handler that changes the masterpage for the application.master at runtime.

Also an FYI, there are many issues once you start customizing list form pages for a site accessible to anon users, so do your research first on that one if needed.

Answer 5

You can use any framework you desire when working with Sharepoint, however, the primary concern is how much control you have over web parts. OOB web parts use table based layout. If you have full control over how the web parts use the markup they product then you are one step closer to using a framework with little headache.

To alleviate some of the table based layout used in web parts you can look at accessibility toolkits to convert the web parts appropriately.