+1-888-365-2779
Try Now
More in this section

Forums / Designing & Styling / .sf_cols class overriding Styles

.sf_cols class overriding Styles

2 posts, 0 answered
  1. Scott
    Scott avatar
    4 posts
    Registered:
    09 Jul 2015
    19 Oct 2015
    Link to this post
    Can someone tell me why the class .sf_cols is added to every layout element in sitefinity? It is overriding bootstrap styles that I have on my site with a width:100%, padding:0 and margin:0 style. I would like the ability to remove it or turn it off on certain layout elements. Any help would be appreciated.
  2. Arnob Makhlaqur
    Arnob Makhlaqur avatar
    41 posts
    Registered:
    29 Sep 2016
    05 Nov 2015
    Link to this post
    Hi Scott,

    .sf_cols is the default css class for the layout element. It is possible to override this class for individual layout element by setting the wrapper class "test" [Ref. image 1] for that element and then by dropping a CSS widget to that element and write the CSS code[Ref. image 2] inside the .test.sf_cols class.

    Steps to follow:

    Edit Layout Element-->Classes & Labels-->write the Wrapper field with a class name (test)-->Click Done and then from Content-->Script and Styles--> drop a CSS widget to the layout element-->Edit-->Write CSS--> .test.sf_cols{ write the custom CSS code here } [Ref. image 3, element inspect in google chrome]

    To remove the .sf_cols class use the custom page template ( custom .master file). Please read our documentation on Create a template using a Master page at http://docs.sitefinity.com/create-a-template-using-a-master-page.


    Regards,
    Arnob Makhlaqur
    Telerik
     
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Sitefinity CMS Ideas&Feedback Portal and vote to affect the priority of the items
     
2 posts, 0 answered