Sharepoint - Hide element using css for a modern page

If you don't need left navigation , I would request you to use Communication site template,in this there has no left navigation.

Now , for your question the exact answer is ,there has no other way apart from SPFX app to hide the left navigation.

You need to build a SPFX app, as modern script editor , where you can inject your CSS , just like Classic in built script editor.

But keep in mind , for modern page classes values (numbers)changes , use * in place of number.


We can install SPFx React Script editor web part and add the web part to the modern page, and then add CSS style into the web part to achieve your requirement.

To install the React Script Editor web part, you can refer to the article below.

Install SPFx React Script editor web part as tenant-scoped solution into Sharepoint Online

Source code: react-script-editor