Как сохранить логотип на панели основного меню при открытии на планшете

По какой-то причине, когда я открываю свою веб-страницу на столе, логотип увеличивается в размерах и закрывает ссылки в главной строке меню.

вот мой исходный код и CSS

      <div class="container">

           <div class="logo"><a class="brand" href="index.html"><img src="../Website/SCM Logo.png" alt="optional logo">               </div>

           <div id="mainmenu" class="menu_container">
                <label class="mobile_collapser">MENU</label>
                <!-- Mobile menu title -->
                <ul>
                     <li class="active"><a href="index.html"></a></li>
                     <!-- Must create links here -->
                     <li><a href="About Us.html">Mechanical</a></li>
                     <li><a href="services.html">Electrical</a></li>
                     <li><a href="portfolio.html">Communication</a></li>
                     <li><a href="contact.html">Contact</a></li>

                </ul>
           </div>
           <div class="triangle-up-left"></div>
           <div class="triangle-up-right"></div>
      </div>
 </header>
Источник

2 ответа

Решение

Вы можете попытаться указать процентный размер для вашего логотипа ex (style="max-height:50%; max-width:50%"). Это позволит масштабировать его на разные устройства, и, надеюсь, он перестанет покрывать ваше главное меню.

Источник

Ваш тег не является полным. Проверьте следующее:

<div class="logo">
  <a class="brand" href="index.html">
    <img src="../Website/SCM Logo.png" alt="optional logo" />
  </a>
</div>
Источник
Другие вопросы по тегам