0

I have a custom master page and referring a custom CSS file, which is successfully implemented. but the suitebar is still referring the corev15.css file and i have tried changing color of the suite bar from my css file, but nothing happens. I have referenced the CSS in my masterpage as well.

CSS I USED

.ms-verticalAlignMiddle{
color: #444 !important;
}
.ms-tableCell{
color: #444 !important;
}
#suitebarleft{
background-color: #444 !important;
}

Masterpage edits added this in the head

<SharePoint:CssRegistration Name="/sites/search/Style Library/intranet.css" After="corev15.css" runat="server"/>

and then this

<!--SPM:<SharePoint:CssRegistration Name="Themable/corev15.css" runat="server"/>-->
        <!--SPM:<SharePoint:CssRegistration Name="/sites/search/Style Library/intranet.css" After="corev15.css" runat="server"/>-->

I just want to change the color of the suitebar from blue to black.

When I inspect the page I have This is the default view i get

Then when I strike out I can see the changes I made This is the after I strike out

Now how do I implement this.

  • Is the other style getting applied? Can you check the browser console and see if your styles are getting overridded by out of the box styles? – Amal Hashim Jul 26 '16 at 15:20
  • @AmalHashim yes I just inspected the elements and edited the description. – CodeAbaddon Jul 26 '16 at 15:22
  • That is very strange. So you can see Intranet.css in the console? – Amal Hashim Jul 26 '16 at 15:30
  • 1
    Just before </head>.. add <style>#suiteBarLeft...</style> – Amal Hashim Jul 26 '16 at 15:38
  • 2
    In your CSS selector you do not have the proper capitalization. You want #suiteBarLeft not #suitebarleft. – Dylan Cristy Jul 26 '16 at 15:41
1

In the CSS you posted, you do not have the proper capitalization.

You want:

#suiteBarLeft

instead of

#suitebarleft
1

You can try adding the CSS directly into the master page

Just before </head>

Add <style>#suiteBarLeft...</style>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.