html 我如何将翻译选择与我的链接放在同一级别?[关闭]

iq0todco  于 11个月前  发布在  其他
关注(0)|答案(1)|浏览(73)

已关闭,此问题需要details or clarity,目前不接受回答。
**想要改进此问题吗?**通过editing this post添加详细信息并澄清问题。

8天前关闭
Improve this question
在我的网站上,我增加了一个小功能,可以让你改变网站的语言。但问题在于我如何定位我的链接和我的翻译选择。我怎么能把所有的东西都放在同一条线上呢?

<nav id="navbar" class="navbar">
    <ul>
      <li><a href="{{route('home')}}" class="nav-link {{ request()->is('home') ? 'active' : '' }}">Acceuil</a></li>
      <li><a href="{{route('a-propos')}}" class="nav-link {{ request()->is('a-propos') ? 'active' : '' }}">A propos</a></li>
      <li><a href="{{route('nos-services')}}" class="nav-link {{ request()->is('nos-services') ? 'active' : '' }}">Services</a></li>
      <li><a href="#">Produits</a></li>
      <li><a href="{{route('blog')}}"  class="nav-link {{ request()->is('blog') ? 'active' : '' }}">Actualites</a></li>
      <li><a href="{{route('contact')}}" class="nav-link {{ request()->is('contact') ? 'active' : '' }}">Contact</a></li>
    </ul>
    <div id="google_translate_element"></div>
  </nav><!-- .navbar -->

字符串

rwqw0loc

rwqw0loc1#

我有一个很大的问题理解你的问题,但正如我所理解的,根据你提供的代码资源。你的问题在于定位翻译元素。如果是这样,那么这就是你需要的CSS样式。并提供更多的细节下次你有任何类型的问题或问题。

<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>StackOverflow</title>
  </head>

  <style>
    .navbar {
      display: inline-flex;
      margin: 10px auto;
      text-align: center;
      flex-wrap: wrap;
      align-items: center;
      justify-content: center;
    }

    ul {
      padding: 10px;
      margin: 5px auto;
      display: inline-flex;
      flex-wrap: wrap;
    }
    li {
      display: inline;
      padding: 5px;
      margin: 10px auto;
    }
    #google_translate_element {
      text-align: center;
    }
  </style>

  <body>
    <nav id="navbar" class="navbar">
      <ul>
        <li>
          <a
            href="{{route('home')}}"
            class="nav-link {{ request()->is('home') ? 'active' : '' }}"
            >Acceuil</a
          >
        </li>
        <li>
          <a
            href="{{route('a-propos')}}"
            class="nav-link {{ request()->is('a-propos') ? 'active' : '' }}"
            >A propos</a
          >
        </li>
        <li>
          <a
            href="{{route('nos-services')}}"
            class="nav-link {{ request()->is('nos-services') ? 'active' : '' }}"
            >Services</a
          >
        </li>
        <li><a href="#">Produits</a></li>
        <li>
          <a
            href="{{route('blog')}}"
            class="nav-link {{ request()->is('blog') ? 'active' : '' }}"
            >Actualites</a
          >
        </li>
        <li>
          <a
            href="{{route('contact')}}"
            class="nav-link {{ request()->is('contact') ? 'active' : '' }}"
            >Contact</a
          >
        </li>
      </ul>
      <div id="google_translate_element">Translate Text</div>
    </nav>
    <!-- .navbar -->
  </body>
</html>

字符串
希望这对你有帮助!)。

相关问题