How to remove logo in SharePoint Online Header?

Question

As we have the logo in the O365 navigation header, we would like to remove the one in the SharePoint header.

I was able to do it using CSS; however, it does feel like a hack and I wonder if there i a best way to do it.

.logoCell-48, .logoCell-49, .logoCell-50, .logoCell-76, .logoCell-77, .logoCell-78, .logoCell-80, .logoCell-82, .logoCell-167 {
    display: none !important;
}

As you can see the logoCell class can have different names and there is a high risk of not covering all possible class names.

Should I automate this to create a css class with all possible numbers from logoCell-X to logoCell-Y? Maybe 30 to 200. It would look ugly.

Is there a better way to accomplish this?

Thanks

Answer 1

You can use your CSS like below:

div[class^="logoCell"] {
    display: none !important;
}

^= is called as starts with selector in CSS or JQuery. Read more about it in CSS below:

CSS [attribute^=value] Selector.