"HTML Source Code" for some examples is hard to visually parse

[charmarkk]

Discovered via #2569's checks. In some examples, like 2569's button, the HTML Source Code section is hard to visually parse due to the stylistic tags wrapping some text. When there's some text wrapped in stylistic tags for things like quotes or code view, it can create a lot of line breaks that can make it a bit confusing/overwhelming to read. Other examples that are arguably more complicated (such as the Breadcrumbs example or of course Comboboxes) are simpler to read because there's less of these types of "inconsequential" tags in the example.

Screenshot of the button example's HTML source code section demonstrating these excessive breaks follows.

Example page: https://www.w3.org/WAI/ARIA/apg/patterns/button/examples/button/

[css-meeting-bot]

The ARIA Authoring Practices (APG) Task Force just discussed "HTML Source Code" for some examples is hard to visually parse.

The full IRC log of that discussion

<jugglinmike> Subtopic: "HTML Source Code" for some examples is hard to visually parse
<jugglinmike> github: https://github.com//issues/2649
<jugglinmike> (MarkMcCarthy explains the problem)
<jugglinmike> Matt_King: I agree that certain tags should be rendered inline with the surrounding text
<jugglinmike> MarkMcCarthy: This behavior is consistent across Chrome and Firefox in Windows and also on Safari in macOS
<jugglinmike> MarkMcCarthy: I don't think this particularly egregious in many places. It's perhaps ironically most noticible in the simpler examples. But in any case, I think we can put this in the backlog.
<jugglinmike> Matt_King: It feels a little agressive to call this a bug. I'm going to label it as an "Enhancement"