列表样式对齐错误

Question

由于某种原因，列表中的第一个元素往往会向右浮动。所有项目符号都应该位于开头，也应该位于所有文本的左侧。

＆＃13;

＆＃13;

.bullet-wrap {
  content: "";
  display: table;
  width: 100%;
  float: left;
}
.five {
  padding-bottom: 1%;
}
.bullet-wrap {
  content: "";
  display: table;
  width: 100%;
  float: left;
}

＆＃13;

<div class="bullet-wrap">
  <div class="bullet-point">
    <span>1</span>Reduce Carbon Footprint
  </div>
  <ul class="bullet-list">
    <li class="five">Using a minimum of 10% recycled pre-consumer cellular PVC scrap By:</li>
    <li class="five">Harvesting heat from equipment to heat plant and office;</li>
    <li class="five">Combining customer orders to maximize shipments.</li>

  </ul>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

您的.bullet-wrap向左浮动，这会使列表中的第一项出现在顶部。

尝试在clear: both;上添加.bullet-list规则。

为了让子弹对齐，您可以尝试使用list-style-position: inside;作为规则。