Wrong display on mobile

Support
1

image
That Blog link is displayed at the bottom left of its parent element on mobile. I cannot figure out why.

It displays fine on desktop.

Just in case: I’ve got another link which is desktop only (so display: none on mobile) with custom CSS to shift it a bit: margin-left: 100px;. If I turn the custom CSS off, nothing changes, which is unsurprising.

Custom Header Links HTML:

    <ul class="custom-header-links">
      <li class="headerLink headerLink--vdo 👆adapter-son-yoga.com--custom-header-links headerLink--undefined">
        <a title="Adapter Son Yoga" href="https://adaptersonyoga.com/" target="_blank">
          👆adapter son yoga.com 
        </a>
      </li>
      <li class="headerLink headerLink--vmo blog-custom-header-links headerLink--undefined">
        <a title="blog" href="https://adaptersonyoga.com/" target="_blank">
          Blog
        </a>
      </li>
  </ul>

Nothing special for CSS on the second li element, and the contained a link CSS is as such:

    .custom-header-links .headerLink a {
	padding: .35em .6em;
	color: var(--header_primary);
	font-size: var(--font-up-1);
    }

Is it a bug or am I missing something?

2

I think it’s the way the padding on the link wraps, I’ve just merged a change that should avoid this.