Answer the question
In order to leave comments, you need to log in
How to align bootstrap-vue vue navigation?
Hello everyone, I can not center
<template>
<div class="header ">
<b-navbar
toggleable="lg"
type="light"
variant="light"
class="container-fluid mx-auto"
>
<div class="logo_wrapper col-md-1 col-sm-1 col-xl-1 ">
<a href="/">
<router-link tag="a" to="/"
><img src="../assets/logo.png" alt="" class="logo " to="/"
/></router-link>
</a>
</div>
<div class=" col-md-10 col-ld-10 text-left col-xl-11 ">
<div class="header row">
<h3 class="col-ld-10">
Централизованная Библиотечная Система Выборгского района
Санкт-Петербурга
</h3>
<a id="specialButton" href="#" class="specialButton ml-2 col-ld-1"
><img
src="https://lidrekon.ru/images/special.png"
alt="ВЕРСИЯ ДЛЯ СЛАБОВИДЯЩИХ"
title="ВЕРСИЯ ДЛЯ СЛАБОВИДЯЩИХ"
/></a>
</div>
<b-navbar-toggle target="nav-collapse"></b-navbar-toggle>
<div class="row ">
<b-collapse id="nav-collapse" is-nav>
<b-navbar-nav>
<b-nav-item
v-for="menu in menuItem"
class="item col-md-1 col-lg-1 text-center col-xl-2"
>
<router-link tag="a" :to="menu.to">{{ menu.name }}</router-link>
</b-nav-item>
<b-nav-item-dropdown
text="Дополнительно"
right
class="item_2 col-md-2 col-lg-2 col-xl-2 text-center"
>
<b-dropdown-item href="#" v-for="menu in menuItem2">{{
menu.name
}}</b-dropdown-item>
</b-nav-item-dropdown>
</b-navbar-nav>
</b-collapse>
</div>
</div>
</b-navbar>
</div>
</template>
Answer the question
In order to leave comments, you need to log in
Add the .justify-content-center class to the parent element of the blocks you want to center align. This is for bootstrap v4.4
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question