locked
Best Practices for SharePoint - CSS RRS feed

  • Question

  • Hi,

    I am looking to style a page on SharePoint with my own custom styles and I was wondering what are the best practices regarding CSS for SharePoint? This potential stylesheet may be used at other places... 

    Thanks,

    Moneka

    Wednesday, February 27, 2013 5:55 PM

Answers

  • If you find you need to override specific SharePoint CSS, I develop another CSS file called something like spoverrides.css.  This CSS file would only hold overrides.

    If you are developing your own webparts, pages, etc, I would create my own CSS classes and use those.


    Brandon Atkinson
    Blog: http://brandonatkinson.blogspot.com

    • Marked as answer by Moneka Thursday, February 28, 2013 9:12 PM
    Wednesday, February 27, 2013 7:22 PM
  • If you are storing your css files in the layouts I highly recommend putting them in layouts/1033/styles/YourFolder/YourCss.Css

    This way you can use SharePoint:CssRegistration runat="server" Name="YourFolder/YourCss.css" and that will also put cache busting on your css files. This way any future updates to packages it will force browsers to grab the new files and users won't have stale css.


    -tom daly

    • Marked as answer by Moneka Thursday, February 28, 2013 9:12 PM
    Wednesday, February 27, 2013 11:27 PM

All replies

  • Personally I'm a fan of deploying a feature that contains all the CSS and JS files they are needed.  This is a clean and easy way to deploy your custom files to be used through-out the Farm.  Check this post: http://brandonatkinson.blogspot.com/2012/11/using-sharepoint-solutions-to-deploy.html

    Brandon Atkinson
    Blog: http://brandonatkinson.blogspot.com

    Wednesday, February 27, 2013 6:58 PM
  • Hi Brandon,

    That's exactly what I was going to do too!

    I was wondering regarding the css file itself - should I override SharePoint's css or should I create my own? I'm not sure - too many opinions out there...

    Thanks

    Moneka

    Wednesday, February 27, 2013 7:04 PM
  • If you find you need to override specific SharePoint CSS, I develop another CSS file called something like spoverrides.css.  This CSS file would only hold overrides.

    If you are developing your own webparts, pages, etc, I would create my own CSS classes and use those.


    Brandon Atkinson
    Blog: http://brandonatkinson.blogspot.com

    • Marked as answer by Moneka Thursday, February 28, 2013 9:12 PM
    Wednesday, February 27, 2013 7:22 PM
  • hi

    1

    don't make style's changes in corev4.css

    2.create your own css file, and load it after corev4.css( in master page - using for example Shapreoint Designer )

    A great post is this one

    http://www.superiorsilkscreen.com/796-864-large/optimist-the-glass-is-half-full-pessimist-the-glass-is-half-empty-engineer-the-glass-is-twice-the-size-it-ne.jpg


    Romeo Donca, Orange Romania (MCSE, MCITP, CCNA) Please Mark As Answer if my post solves your problem or Vote As Helpful if the post has been helpful for you.

    Wednesday, February 27, 2013 8:18 PM
  • If you are storing your css files in the layouts I highly recommend putting them in layouts/1033/styles/YourFolder/YourCss.Css

    This way you can use SharePoint:CssRegistration runat="server" Name="YourFolder/YourCss.css" and that will also put cache busting on your css files. This way any future updates to packages it will force browsers to grab the new files and users won't have stale css.


    -tom daly

    • Marked as answer by Moneka Thursday, February 28, 2013 9:12 PM
    Wednesday, February 27, 2013 11:27 PM