Home>Support>Hero-image covers menu in new WordPress Twenty-Twenty-One Layout and images problem

Hero-image covers menu in new WordPress Twenty-Twenty-One Layout and images problem

Hi!

Hero Image is unfortunately covering the menu in mobile version of the site of new WordPress Twenty-Twenty One Layout =. I tried to set z-index to 100 or 999 with “!important” to several classes and ids (listed below) but nothing seems to work.

.primary-navigation-open 
.primary-navigation 
.primary-menu-container
.navigation-top
#primary-menu-list
.menu-wrapper
#site-navigation
#nav_menu_instance

The second problem is that if I put a image inside Hero Image (I mean: not the background, but some custom img inside the paragraph) it takes the height and width of the whole Hero Image area (it’s streteched). I can add fixed height and width to the image, but then it doesn’t resize as it supposed to with reducing screen resolution.

Any advice would be appreciated :).

Thanks!
Y

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 3 months, 1 day ago Alex S Hi, I Work Here

    Hi Yomo,

    This can correct this by adding the following custom CSS to AppearanceCustomize, Additional CSS:

    .primary-navigation-open .primary-navigation {
        z-index: 101;
    }

    Kind regards,
    Alex

  2. 2 months, 27 days ago yomo_1234

    Hi Alex,

    Unfortunately that also doesn’t work :(. Hero Image is still covering menu in mobile version in Twenty-Twenty-One Layout.

    Is there any other idea that we could try?

    Thanks,
    Y

  3. 2 months, 26 days ago Alex S Hi, I Work Here

    Hi,

    That’s odd. The CSS I replied with is working for me. If you haven’t already, please try clearing your browser cache to see if that helps.

    If it doesn’t, do you have a public URL where we can take a look at your site? This will allow me to inspect your markup and work out why the provided CSS isn’t working on your site.

    Kind regards,
    Alex

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More