1.1.0 navbar alignment

[j4mie]

Hi, thanks for missing.style!

I seem to have a regression between 1.0.9 and 1.1.0 with the following markup:

    <header class="navbar">
      <div>
        <a href="/" class="allcaps">
          Reactor⚡
        </a>
      </div>
      <nav aria-label="Dashboard sections">
        <ul role="list">
          <li>
            <a href="/climate/">
              Climate
            </a>
          </li>
          <li>
            <a href="/energy/">
              Energy
            </a>
          </li>
          <li>
            <a href="/system/logs/">
              System
            </a>
          </li>
        </ul>
      </nav>
    </header>

On 1.0.9 it looks like this:

On 1.1.0 it looks like this:

(in other words, the navbar is now right-aligned rather than centred).

[dz4k]

I can't reproduce on the latest version, can you check if it's been fixed?

[j4mie]

@dz4k still the same for me on 1.1.1. Is there anything I can do to help debug?

[dz4k]

@j4mie could you make a minimal reproduction on CodePen or somewhere similar?

[graf0]

have the same problem with 1.1.1 - but only of Firefox, on Edge it's centered.

[graf0]

it seems that under edge following style is applyied to last child of nav:

But on firefox - it's not applied.

[j4mie]

Hopefully I've done this right: https://codepen.io/j4miem/pen/ExMePqK

Agreed with @graf0 that it seems to be Firefox-specific issue. Works fine in Chrome and Safari.

[Fingel]

Does anyone know a workaround for this? I thought it was default behavior since I use Firefox, spent a while trying to fix it.
The issue appears after upgrading from 1.0.13 to 1.1.0.

[graf0]

Does anyone know a workaround for this? I thought it was default behavior since I use Firefox, spent a while trying to fix it.

The issue appears after upgrading from 1.0.13 to 1.1.0.

Try to add margin-right:auto to last element in navbar