У меня возникла следующая проблема с Navbar в браузерах Safari:
У меня нет устройства iOS или Ma c так что я не могу отладить его локально. Я уже попытался добавить пустую href="#"
к моему b-navbar-toggle
, как это было рекомендовано другим потоком, но безуспешно.
Мой код навигационной панели выглядит следующим образом. Больше не добавлено CSS.
<template>
<b-navbar id="nav" toggleable="lg" type="dark" variant="dark">
<b-container>
<b-navbar-brand to="/">TRIAB</b-navbar-brand>
<b-navbar-toggle href="#" target="nav-text-collapse"></b-navbar-toggle>
<b-collapse href="#" id="nav-text-collapse" is-nav>
<b-navbar-nav>
<b-nav-item active-class="active" exact to="/">{{ $t('nav.home') }}</b-nav-item>
<b-nav-item active-class="active" to="/about">{{ $t('nav.about') }}</b-nav-item>
<b-nav-item active-class="active" to="/products">{{ $t('nav.products') }}</b-nav-item>
<b-nav-item active-class="active" to="/news">{{ $t('nav.news') }}</b-nav-item>
<b-nav-item active-class="active" to="/contact">{{ $t('nav.contact') }}</b-nav-item>
</b-navbar-nav>
<b-navbar-nav class="ml-auto">
<b-nav-item @click="$i18n.locale = 'en'">
<img src="../../assets/img/flags/us.png" alt="us flag">
</b-nav-item>
<b-nav-item @click="$i18n.locale = 'sv'">
<img src="../../assets/img/flags/sv.png" alt="sv flag">
</b-nav-item>
</b-navbar-nav>
</b-collapse>
</b-container>
</b-navbar>
</template>
Навбар без проблем работает как на Android, Chrome, Firefox, так и на Edge. У кого-нибудь есть идеи, почему это происходит?