Question

我正在使用带有angularjs的物化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文件的大小，并进行比较。此外，您可以使用image属性或锚点使用background-position-y CSS属性向上移动margin-top s。

材料css按钮切断图标

1 个答案: