Question

<nav class="uk-navbar">
    <div class="uk-container uk-container-center">
        <a href="#" class="uk-navbar-brand"><img src="images/logo.png" 
  alt="AlminasLogo"/></a>

        <ul class="uk-navbar-nav">
            <li class="uk-active"><a href="#">Pagrindinis</a></li>
            <li><a href="">Paslaugos</a></li>
            <li><a href="">Atsiliepimai</a></li>
            <li><a href="">Apie</a></li>
            <li><a href="">Kontaktai</a></li>
        </ul>

        <div class="uk-navbar-flip">
            <ul class="uk-navbar-nav">
                <li><a href=""><i class="uk-icon-facebook"></i></a></li>
                <li><a href=""><i class="uk-icon-instagram"></i></a></li>
            </ul>
        </div>
   </div>
</nav>

这是我的代码示例，结果如下：https://imgur.com/a/mCkYr

如您所见，navbar居中，但navbar-flip不是。为什么这样以及如何集中它？它们都已包含在uk-container-center ....

中

Answer 1

我已经测试了您的代码（我没有徽标），结果就是您假装的内容。

我想你的徽标必须是在第一个div中推送所有东西的东西！

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.4/css/uikit.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.4/js/uikit.min.js"></script>

<body>
  <nav class="uk-navbar">
    <div class="uk-container uk-container-center">
      <a href="#" class="uk-navbar-brand"><img src="images/logo.png" alt="AlminasLogo" /></a>

      <ul class="uk-navbar-nav">
        <li class="uk-active"><a href="#">Pagrindinis</a></li>
        <li><a href="">Paslaugos</a></li>
        <li><a href="">Atsiliepimai</a></li>
        <li><a href="">Apie</a></li>
        <li><a href="">Kontaktai</a></li>
      </ul>
      <div class="uk-navbar-flip">
        <ul class="uk-navbar-nav">
          <li><a href=""><i class="uk-icon-facebook"></i></a></li>
          <li><a href=""><i class="uk-icon-instagram"></i></a></li>
        </ul>
      </div>
    </div>
  </nav>
</body>

＆＃13;

Ps：下次请用英语提供所有内容并且没有无法访问的代码（例如：images/logo.png）。你的问题和答案应该适用于每个人，不仅仅适用于你的情况;）

Uikit中心导航

1 个答案: