Css 将字体图标添加到引导4标注

我试图在引导4调用的左侧添加一个图标，但它显示在H4的上方

我要在左边，然后是留言。我也试过了。p：最后一个孩子也试过了，但没有效果

这是标记

<div class="callout callout-danger" *ngIf="!isMarked">
   <i class="fal fa-sensor-alert fa-2x mr-2"></i>
   <h4>{{childName }} is currently NOT marked.</h4>
   Mark now.
</div>

---

编辑：尝试使用网格将图标、h4和车身并排放置

...
{{childName}}当前未标记。请立即标记。
...

谢谢@HardlyNoticeable我这样做了，但是第二行的文本没有相应地调整，看起来好像被包装了。

.callout {
  padding: 20px;
  margin: 20px 0;
  border: 1px solid #eee;
  border-left-width: 5px;
  border-radius: 3px;
}

.callout .h4 {
  margin-top: 0;
  margin-bottom: 5px;
  padding-left:20px;
}

.callout .p:last-child {
   margin-bottom: 0;
}

.callout .code {
   border-radius: 3px;
}

.callout .bs-callout {
   margin-top: -5px;
}

.callout-success {
   border-left-color: #5cb85c;
}

.callout-danger {
  border-left-color: #d9534f;
}