如何使单选按钮正常工作以实现css设计

Question

这是用于单选按钮部分的源代码。如果我添加materialize.min.css，那么单选按钮不能在任何浏览器上运行。如果我只是把这个代码放在在线测试器而不放入css文件。代码正常工作。使用materialize css设计时单选按钮发生了什么？

<div class="row">
<form class="col s12">
  <h1 class="grey-text text-lighten-5">Tool Inventory Report</h1>
  <div class="row">
        <div class="input-field col s8">
          <p class="grey-text text-lighten-5"><b>Type:</b></p>
          <input name="grp1" type="radio" id="alltools" /><label for="alltools">All Tools</label>
          <input name="grp1" type="radio" id="handtool" /><label for="handtool">Hand Tool</label>
          <input name="grp1" type="radio" id="gardentool" /><label for="gardentool">Garden Tool</label>
          <input name="grp1" type="radio" id="ladder" /><label for="ladder">Ladder</label>
          <input name="grp1" type="radio" id="powertool" /><label for="powertool">Power Tool</label>
        </div>
        <div class="input-field col s4">
          <p class="grey-text text-lighten-5"><b>Customer Search:</b></p>
          <input type="text" class="form-control" placeholder="Enter Keyword" id="search" style="max-width: 80%; width: 60%;">
          <button class="btn btn-info btn-sm" type="submit">Search</button>
        </div>
  </div>
</form></div>