更改徽标位置

时间:2018-05-16 08:39:00

标签: css

我需要更改我的徽标位置。我已经尝试过我从css知道的任何代码,但仍然无法改变位置。 我希望徽标与菜单的高度相同。 需要你的帮助!

我的网站是:http://ktiniatreio-keratea.gr/

4 个答案:

答案 0 :(得分:1)

添加到css

.navbar-header{
    display: inline-block;}

答案 1 :(得分:0)

把:

<div class="main-navigation navbar-collapse collapse">

class="navbar-header"内。

preview

您的最终代码应如下所示:

<div class="navbar-header">
  <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"><i class="fa fa-bars"></i></button>
  <a href="http://ktiniatreio-keratea.gr/" class="custom-logo-link" rel="home" itemprop="url"><img width="290" height="70" src="https://i2.wp.com/ktiniatreio-keratea.gr/wp-content/uploads/2018/03/cropped-logo_pet-2.png?fit=290%2C70" class="custom-logo" alt="Κτηνιατρικό Κέντρο : Λυγιάς – Νεοφύτου"></a>
  <div class="main-navigation navbar-collapse collapse">
    <div id="mega-menu-wrap-primary" class="mega-menu-wrap">
      <div class="mega-menu-toggle" tabindex="0">
        <div class="mega-toggle-blocks-left">
          <div class="mega-toggle-block mega-menu-toggle-block mega-toggle-block-1" id="mega-toggle-block-1"><span class="mega-toggle-label"><span class="mega-toggle-label-closed">MENU</span><span class="mega-toggle-label-open">MENU</span></span>
          </div>
        </div>
        <div class="mega-toggle-blocks-center"></div>
        <div class="mega-toggle-blocks-right">
          <div class="mega-toggle-block mega-menu-toggle-block mega-toggle-block-2" id="mega-toggle-block-2"><span class="mega-toggle-label"><span class="mega-toggle-label-closed">MENU</span><span class="mega-toggle-label-open">MENU</span></span>
          </div>
        </div>
      </div>
      <ul id="mega-menu-primary" class="mega-menu max-mega-menu mega-menu-horizontal">
        <li class="mega-menu-item mega-menu-item-type-post_type mega-menu-item-object-page mega-menu-item-home mega-current-menu-item mega-page_item mega-page-item-150 mega-current_page_item mega-align-bottom-left mega-menu-flyout mega-menu-item-157" id="mega-menu-item-157"><a class="mega-menu-link" href="http://ktiniatreio-keratea.gr/" tabindex="0">Αρχική</a></li>
        <li class="mega-menu-item mega-menu-item-type-post_type mega-menu-item-object-page mega-align-bottom-left mega-menu-flyout mega-menu-item-241" id="mega-menu-item-241"><a class="mega-menu-link" href="http://ktiniatreio-keratea.gr/%ce%b9%ce%b1%cf%84%cf%81%ce%b5%ce%b9%ce%b1/" tabindex="0">Τα Ιατρεία</a></li>
        <li class="mega-menu-item mega-menu-item-type-post_type mega-menu-item-object-page mega-align-bottom-left mega-menu-flyout mega-menu-item-242" id="mega-menu-item-242"><a class="mega-menu-link" href="http://ktiniatreio-keratea.gr/%cf%85%cf%80%ce%b7%cf%81%ce%b5%cf%83%ce%b9%ce%b5%cf%82/" tabindex="0">Υπηρεσίες</a></li>
        <li class="mega-menu-item mega-menu-item-type-post_type mega-menu-item-object-page mega-align-bottom-left mega-menu-flyout mega-menu-item-521" id="mega-menu-item-521"><a class="mega-menu-link" href="http://ktiniatreio-keratea.gr/team/" tabindex="0">Προσωπικό</a></li>
        <li class="mega-menu-item mega-menu-item-type-post_type mega-menu-item-object-page mega-align-bottom-left mega-menu-flyout mega-menu-item-244" id="mega-menu-item-244"><a class="mega-menu-link" href="http://ktiniatreio-keratea.gr/contact/" tabindex="0">Επικοινωνία</a></li>
      </ul>
    </div>
  </div>
</div>

答案 2 :(得分:0)

display: inline;添加到您的navbar-header

e.g。

<div class="navbar-header" style="
    display: inline;
">

答案 3 :(得分:0)

在您的类容器中

.container{
display:flex;
justify-content:space-between;
}

.main-navigation{
margin:auto;}

enter image description here