Native Styles should remove the default padding/list style from <menu> to match <ol> and <ul>

[dorrzun]

<menu> is a semantic variant of <ul> and <ol> available since 2015.

I noticed that Native Styles (and presumably the others) do not remove this padding or adjust the list marker.

[claviska]

Good observation. I'm not sure it should, though. We don't want to style <menu> visually as list items, and most people probably want to use some sort of flex layout (e.g. a row of buttons, a column of links).

Having an opinion here would mean many users have to override the default styles to get what they actually want rather than just set the styles they want from scratch.

Even the example on MDN sets custom styles for it:

menu {
  list-style-type: none;
  display: flex;
  padding: 0;
  margin-bottom: 0;
  gap: 1em;
}

[dorrzun]

@claviska Based on MDN, if <menu> is semantically equivalent to <ul>, shouldn't it arguably match the styling that WebAwesome currently provides for <ul> and <ol>?

Fully agree on the example you've shown and developers being likely to go with a flex layout, but that seems to strengthen the case for removing the user agent's padding and list styles, as that would inhibit the layout (MDN's example does exactly that).

I can't personally think of a scenario where someone would want the padding or list styling, given that <menu> is intended for interactive controls/commands

[claviska]

Got it. You're suggesting zeroing out the user agent styles. I think that's reasonable. What do you think, @lindsaym-fa?

[lindsaym-fa]

Agreed! I have a change ready to go in #2450