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

Safari shows double arrows in nav menu #97

Open
emersonveenstra opened this issue Jun 19, 2021 · 2 comments
Open

Safari shows double arrows in nav menu #97

emersonveenstra opened this issue Jun 19, 2021 · 2 comments
Labels
Area: Jekyll Related to how the site is generated Type: Bug Issues in how things are displayed, or instructions that leads to errors

Comments

@emersonveenstra
Copy link
Contributor

Because we're using <details>, we're running into two things:

  1. WebKit adds a pseudo-element -webkit-details-marker that doubles the arrows, and removing it leads to:
  2. this WebKit bug where <summary> can't be a flex container, and it breaks the alignment.

Not sure if we want to wait until Safari releases a version that fixes it, or switch to a standard <nav>/<ul> structure for the menu.

@emersonveenstra emersonveenstra added Area: Jekyll Related to how the site is generated Type: Bug Issues in how things are displayed, or instructions that leads to errors labels Jun 21, 2021
@arunabhp75
Copy link

arunabhp75 commented Aug 15, 2021

@emersonveenstra, something similar was there for Chrome too, refer this. Can display:none be added to hide it ?

@emersonveenstra
Copy link
Contributor Author

emersonveenstra commented Aug 15, 2021

something similar was there was for Chrome too, refer this. Can display:none be added to hide it ?

You can, but the arrow is only half the problem, it's the fact that <summary> can't be a flex container. So the other arrow is still weirdly stacked on top of the text.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Area: Jekyll Related to how the site is generated Type: Bug Issues in how things are displayed, or instructions that leads to errors
Projects
None yet
Development

No branches or pull requests

2 participants