时间戳

首页 > 解决方案 > 在导航栏上实现中心垂直标志品牌

html - 在导航栏上实现中心垂直标志品牌

问题描述

我有以下用于导航栏的 HTML 代码。使用物化框架

<div class="nav-wrapper">
    <a href="#" class="brand-logo valign-wrapper logo">
        <img src="{% static 'imgs/logo_transparent_bg.png' %}" width='40px'>
    </a>
    <a href="#" class="brand-logo center hide-on-med-and-down">
        Heartist
    </a>
    <a href="#" data-target="mobile-demo" class="sidenav-trigger"><i class="fas fa-bars"></i></a>
    <ul class="right hide-on-med-and-down">
        <li><a href="sass.html">Sass</a></li>
        <li><a href="badges.html">Components</a></li>
        <li><a href="collapsible.html">Javascript</a></li>
        <li><a href="mobile.html">Mobile</a></li>
    </ul>
</div>

CSS：

.logo > img {
  position: relative;
  top:1.4vh;
  margin-left: 5px;
  margin-right: 5px;

}

这是预览：http: //i.imgur.com/yk3AGoa.png

问题是它没有响应。如果我在手机上放大或查看，则徽标不是垂直居中的。

不使用 X 断点的任何想法？

提前致谢

标签： htmlcssmaterialize

解决方案

推荐阅读