1

This action I perform all the time using content editor in SharePoint 2013 version. This time I want to make the change to the master page. I want the changed to seen on every page.

What am I trying to do?

I want to increase the width the fly-out menu only on the quick launch bar.

Searching on the internet I found several options, but I want to know the best one to use. I was thinking to use the code below and put it in the header of the master page. Would this work? Any help would be helpful.

<style>
    #DeltaPlaceHolderLeftNavBar 

    .menu li.hover 
 {

   background:Red;

 }

    .menu-item
 {
     background-color:white;
     width:200px;
 }
</style>

1 Answer 1

2

While it would work to put the CSS directly in the MasterPage, this approach is not recommended.

If you have multiple site collection, you would have to upload your custom MasterPage manually to all the sites. And if you sometime further on need to change something in the embedded CSS, you would have to update every sitecollection.

I think that you should just create a simple CSS file and use upload it to the topsites style library/site assets and use Alternate CSS Url.

enter image description here

Or you could create a copy of the default Seattle/Oslo masterpage, rename it (never edit the default masterpages directly, always create a copy!) and add a script link in your custom masterpage that points to a local library in your site/server.

Adding CSS and JavaScript files to SharePoint 2013 MasterPage

2
  • Great! Thank you @Christoffer. Can I use the code placed in my question? Feb 28, 2017 at 19:47
  • @SharePointLady As long as it works, yes :) Feb 28, 2017 at 20:04

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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