css - 样式列表项，用 fontawesome 替换 bullet

Question

我必须创建一个这样的列表

我试图用 fontawesome 图标替换元素符号，但我得到的是这样的东西

请注意，两者之间存在间距差异。我的 CSS 是

.custom_list li {
 line-height:2em;
 padding-left:0px;
 padding-top:5px;
 padding-bottom:5px;
 font-size:14px;
 list-style-type:none;
 list-style:none;
}
.custom_list li:before {
 font-family: 'FontAwesome';
 content: "\f192";
 color: black;
 margin-right:15px;
}

HTML 是

<ul class="custom_list" >
  <li>Medical Student Education</li>
  <li>Resident Training Education (Medicine, Osteopathic, Pharmacy)</li>
  <li>Fellowship Training Education (all medical subspecialties)</li>
  <li>Nursing Student Training Education</li>
  <li>Nurse Practitioner Education</li>
  <li>Nurse Continuing Education</li>
  <li>Physician Continuing Medical Education</li>
</ul>

我做错了什么？

Answer 1

.custom_list li {
 line-height:2em;
 padding-left:0px;
 padding-top:5px;
 padding-bottom:5px;
 font-size:14px;
 list-style-type:none;
 list-style:none;
 display: table-row;
}
.custom_list li:before {
 font-family: 'FontAwesome';
 content: "\f192";
 color: black;
 margin-right:15px;
 display: table-cell;
}

您需要将列表格式更改为表格