Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

1.1.0 navbar alignment #32

Closed
j4mie opened this issue Sep 3, 2023 · 10 comments
Closed

1.1.0 navbar alignment #32

j4mie opened this issue Sep 3, 2023 · 10 comments
Labels
bug Something isn't working visual A visual issue, affecting the appearance of pages. Can be usability-related or simply aesthetic.

Comments

@j4mie
Copy link

j4mie commented Sep 3, 2023

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:

image

On 1.1.0 it looks like this:

image

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

@dz4k
Copy link
Collaborator

dz4k commented Jan 26, 2024

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

@dz4k dz4k added bug Something isn't working visual A visual issue, affecting the appearance of pages. Can be usability-related or simply aesthetic. labels Jan 27, 2024
@j4mie
Copy link
Author

j4mie commented Jan 31, 2024

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

@dz4k
Copy link
Collaborator

dz4k commented Feb 1, 2024

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

@graf0
Copy link

graf0 commented Feb 8, 2024

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

@graf0
Copy link

graf0 commented Feb 8, 2024

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

But on firefox - it's not applied.

@j4mie
Copy link
Author

j4mie commented Feb 8, 2024

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
Copy link

Fingel commented Feb 21, 2024

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
Copy link

graf0 commented Feb 23, 2024

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

@dz4k
Copy link
Collaborator

dz4k commented Jun 13, 2024

this was an artifact of our compiler being too overzealous with backcompat and replacing modern css with stuff that doesn't work. should be fixed in 1.1.2 (releasing soon)

@dz4k dz4k closed this as completed Jun 13, 2024
@j4mie
Copy link
Author

j4mie commented Jun 14, 2024

❤️ thank you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working visual A visual issue, affecting the appearance of pages. Can be usability-related or simply aesthetic.
Projects
None yet
Development

No branches or pull requests

4 participants