adjust styling only on home page

Hello-

I want to change the margin of the mega-menu on all pages except my home page, but it isn't working:

.mega-menu {
  position: relative;
  z-index: 5;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #f1f1f1;
    color: #555;
    text-align: center;
    margin: 0 0 0px;
    font-size: 0;
}
.home-page .mega-menu {
    margin: 0 0 30px;
}

Is this not possible?

Thanks!

Hello,

It depends on the placement of the Mega Menu. If your menu is placed in the header div it will not work because the .home-page class is placed in the master-wrapper-content. If you are using nopCommerce version 3.8 you will have unique class on the html element of every page, so you could try replacing .home-page with .html-home-page. If you are using an older version of nopCommerce we can provide you with a different solution. Maybe you can submit a ticket about that issue.

Thank you, that works perfectly!

I did notice in 3.80 the new class in /Home/index.cshtml, but it didn't occur to me to try using it!