material css按钮剪切图标

Question

我正在使用带angularjs的materialize css ...我的按钮图标被切掉了，我尝试了物化图标和字体超赞的图标，同样的结果。

screenshot of buttons with icons moved downward and cut off

<nav class="red darken-4">
    <div class="nav-wrapper">
        <a href ng-click="navToCPQ()"><img class="ml-3" src="../../assets/content/images/logo.png" /></a>
        <div class="right pr-3">
            <a href class="waves-effect waves-light btn red darken-2"><i class="fas fa-cog"></i></a>
            <a href class="waves-effect waves-light btn red darken-2"><i class="fas fa-user-circle"></i></a>
        </div>
        <ul class="pr-3 right hide-on-med-and-down">
            <li><a href ng-click="navToCPQ()">CPQ</a></li>
            <li><a href ng-click="navToPC()">Process Control</a></li>
        </ul>
    </div>
</nav>

Answer 1

问题出在你的CSS里面。在看不到实际代码的情况下，我们只能猜测问题的确切原因以及可能的理想解决方案。

但是，由于图像被截断了，你可以设置容器的height，这样它就会更大，并且会有image的位置。你也可以检查image标签的大小和image文件的大小，然后进行比较。此外，还可以使用background-position-y属性向上移动image或使用margin-top CSS属性向上移动锚点。