O
O
orexov6662020-11-17 12:51:38
Bootstrap
orexov666, 2020-11-17 12:51:38

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

1 answer(s)
D
Danny Arty, 2020-11-17
@DanArst

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 question

Ask a Question

731 491 924 answers to any question