用户界面未按我新建的角度网络应用程序的要求进行渲染

Question

标签以及用户输入区域的标签意外重叠。我希望它们像其中一些一样清晰显示。与“易腐烂？”相关的输入字段标签也未按预期呈现，应该允许用户选择true或false（布尔输入选择器）。 “类别”和“适用商店”的输入字段应允许用户从下拉列表中分别选择一个值或多个值。

Faulty UI

<div class="card" >
<div class="card-content">
<span class="card-title " style="text-align: center">Add Product</span>
<form (ngSubmit)="onSubmit()">
   <div class="row">
    <div class="input-field col s6">
      <input type="number" placeholder="add product reference" 
[(ngModel)]="product.product_ref" name="product reference">
      <label>Product Reference</label>
    </div>
    <div class="input-field col s6">
      <input type="string" placeholder="add product name" 
[(ngModel)]="product.name" name="product name">
      <label>Product Name</label>
    </div>
  </div>
  <div class="row">  
    <div class="input-field col s6">
      <input type="string" placeholder="add product description" 
[(ngModel)]="product.description" name="product description">
      <label>Product Description</label>
    </div>
    <div class="input-field col s6">
      <input type="number" placeholder="add product price" 
[(ngModel)]="product.price" name="product price">
      <label>Product Price</label>
    </div>
  </div>
  <div class="row">
    <div class="input-field col s6">
      <select [(ngModel)]="product.perishable" name="product perishability">
        <option value="True">True</option>
        <option value="False">False</option>
      </select>
      <label>Perishable ?</label>
    </div>
    <div class="input-field col s6">
      <select [(ngModel)]="product.category"name="product category">
        <option value="Fruit & Veg">Fruit & Veg</option>
        <option value="Dairy">Dairy</option>
        <option value="Cupboard">Cupboard</option>
        <option value="Bakery" selected>Bakery</option>
      </select>
      <label>Product Category</label>
    </div>
  </div>
  <div class="row">
    <div class="input-field col s6">
      <select [(ngModel)]="shopapplicable"name="product category">
        <option value="PnP Rondebosch">PnP Rondebosch</option>
        <option value="Pnp Claremont">Pnp Claremont</option>
        <option value="PnP Wynberg">PnP Wynberg</option>
        <option value="Pnp Observatory">Pnp Observatory</option>
      </select>
      <label>Applicable Shops** (requires quick multiselectoptions)</label>
    </div>
    <div class="input-field col s6">
    <input type=submit value="Submit" class="btn">
    </div> 
  </div>
</form>
</div>
<label>N.B * this also needs to include ingredient info ,related products 
array and specific dietry cat it qualifies for</label>
</div>