This is sort of weird. I have a set of pages and the navigation looks the same on all but one page. After trial/error I was able to narrow it down to having a list on my page. As soon as I add a list to the page it appears that Gutenberg applies an inline style called "wp-block-list-inline-css" and that interferes with the navigation because the inline style is ul.has-background{padding:1.25em 2.375em} which impacts the navigation as well. I don't see the 1.25em anywhere in the theme files. Any ideas on how to either prevent the style injection or how to change the style?

  • I was able to override it by getting a bit more specific in the theme style, adding this line: .wp-block-navigation__responsive-container-content ul {padding:0;}
    – J.P.
    Oct 26, 2023 at 19:06
  • That's a mystery for me as well. This ul.has-background rule is too wide as it impacts things it's not supposed to. And I don't understand either the meaning of applying an .has-background class where there is no background. Looks like a collision between both Navigation and List blocks
    – challet
    Mar 7 at 12:08
  • That's the bug reported here github.com/WordPress/gutenberg/issues/50486
    – challet
    Mar 7 at 12:11


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Browse other questions tagged or ask your own question.