Forum Discussion

Anonymous

May 16, 2017

Removing the Quick Launch & Keeping the Global Navigation Bar in SP Online to max Screen Real estate

Hi SharePoint Experts, I am a business guy that is trying to develop my department's SharePoint Online site. I understand the benefits, and know the basics of the "Quick Launch menu" links (navig...

developer

Responsive

Brent Ellis

Silver Contributor

May 16, 2017

If you are sticking with the classic UI, i'd recommend doing a bit of custom code (specifically CSS either by using the alternate CSS set on the /_layouts/15/ChangeSiteMasterPage.aspx or maybe injecting a usercustomaction)

#sideNavBox { display:none !important }
#contentBox { margin-left:20px !important; }

Those two lines are all you need, you just need a way to get them injected into the entire site.

Danny Engelman

Iron Contributor

May 18, 2017

#sideNavBox { display:none !important }
#contentBox { margin-left:20px !important; }

It is common for non Front-enders to whack in ``!important`` because they are fighting CSS load order.

But you have now hijacked the DOM elements and no other App or CSS style can easily restore them.

Just increase Specificity so it doesn't matter in which order your CSS is applied

#sideNavBox#sideNavBox { display:none}
#contentBox#contentBox { margin-left:20px}

By adding even more Specificity any other code can still override you changes

After Selectors:
https://code.tutsplus.com/tutorials/the-30-css-selectors-you-must-memorize--net-16048

Specificity is the most powerfull CSS concept:
https://www.smashingmagazine.com/2007/07/css-specificity-things-you-should-know/