如何控制图标和文本之间的空间 Materialize答案

【问题标题】：How do i control the space between the icon and text Materialize如何控制图标和文本之间的空间 Materialize
【发布时间】：2018-06-01 19:23:18
【问题描述】：

  <ul id="slide-out" class="side-nav fixed" >
      <div class="logo"><a href="#" class="brand-logo"><%= image_tag "logo.png", height:"auto",width:"120" %></a></div>
      <ul class="collapsible" data-collapsible="accordion">
        <li>
          <div class="collapsible-header" style="font-size: 15px"><i class="material-icons" style="font-size: 20px">send</i><span>Main</span></div>
          <div class="collapsible-body" style="background:blue" style="font-size: 15px">
            <ul>
            <a href=""> <li><<i class="material-icons" style="font-size: 20px">send</i> Message</a> </li>
            <a href=""><li><i class="material-icons" style="font-size: 20px">send</i> Scheduler</a> </li>
            </ul>
          </div>
        </ul>
    <ul>

【问题讨论】：

您能详细说明一下您的问题吗？

标签： html css icons materialize

【解决方案1】：

一个快速的技巧可以是添加一些不间断的空格&nbsp;，但我不推荐它。否则，您可以在 css 文件中查找该特定类并修改填充。

【讨论】：

【解决方案2】：

您可以在图标周围使用<span> 标签并使用样式属性提供填充。

<a href=""> <li><span style="padding-right: 5px"><i class="material-icons" style="font-size: 20px">send</i></span> Message</a> </li>

【讨论】：