Forum Discussion
IS it Possible to remove the left hand nav from a modern team site
I think the supported way to do this would be to write an extension (so it is applied to all pages in the site) that implements CSS to make the changes you are after.
The CSS to hide the left hand nav on a modern page is:
nav[role='navigation'] { display: none !important; } div[class^='searchBox_'] { display: none !important; } div[class^='pageContainer_'] { left: 0 !important; }The same extension that injects this CSS could also display a search box (if you want it on every page), that redirects users to your search results page and injects the query into the 'k' querystring parameter
hope it helps,
Nigel
I think the supported way to do this would be to write an extension (so it is applied to all pages in the site) that implements CSS to make the changes you are after.
The CSS to hide the left hand nav on a modern page is:
nav[role='navigation'] {
display: none !important;
}
div[class^='searchBox_'] {
display: none !important;
}
div[class^='pageContainer_'] {
left: 0 !important;
}
The same extension that injects this CSS could also display a search box (if you want it on every page), that redirects users to your search results page and injects the query into the 'k' querystring parameter
hope it helps,
Nigel
Thanks Nigel - it certainly does.
Thanks Nigel, that's what I am trying to do from the extension.
Did you notice a that left nav is still rendered for a split second before our application customizer actually loads?
Hey,
mine is actually running from a web part on the page (not a customizer) and yes it definitely shows the LHS nav for a flicker before the CSS is processed.
There may be a better way to get the CSS processed earlier in the page load, but I am not sure how/what is the best way to achieve that - sorry.
If you do find out, please post the solution on this thread as it would be good to know
Thanks
Nigel
How are you doing this from a web part on a modern page?
