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.
Need fast email support? Get SiteOrigin Premium
Replies
3Hi 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
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
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.