`<a role="button">` is not vertically aligned with `<button>` in `<nav>` #496

carlreinke · 2024-03-19T04:33:39Z

Describe the issue

<a role="button"> is not vertically aligned with <button> in a <nav>.

Current Behavior

Expected Behavior

Reproduction URL

<head>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@2.0.6/css/pico.min.css" />
</head>
<body>
  <article>
    <nav>
      <ul>
        <li><a href="#">a</a></li>
        <li><button>button</button></li>
        <li><a href="#" role="button">a[role="button"]</a></li>
      </ul>
    </nav>
  </article>
</body>

Environment

Firefox on Windows 10

The text was updated successfully, but these errors were encountered:

enzoclock · 2024-03-22T13:14:57Z

+1 👍. There is a margin bottom for buttons that have one of the three [type="..."] properties, but not for the default button. I wonder if this behavior should be aligned

carlreinke changed the title ~~<a role="button"> is not vertically aligned in <nav>~~ <a role="button"> is not vertically aligned with <button> in <nav> Mar 19, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

`<a role="button">` is not vertically aligned with `<button>` in `<nav>` #496

`<a role="button">` is not vertically aligned with `<button>` in `<nav>` #496

carlreinke commented Mar 19, 2024 •

edited

enzoclock commented Mar 22, 2024

<a role="button"> is not vertically aligned with <button> in <nav> #496

<a role="button"> is not vertically aligned with <button> in <nav> #496

Comments

carlreinke commented Mar 19, 2024 • edited

Describe the issue

Current Behavior

Expected Behavior

Reproduction URL

Environment

enzoclock commented Mar 22, 2024

`<a role="button">` is not vertically aligned with `<button>` in `<nav>` #496

`<a role="button">` is not vertically aligned with `<button>` in `<nav>` #496

carlreinke commented Mar 19, 2024 •

edited