HTML&；CSS不能将DIV与I分开

我试图为一个网站创建一个菜单栏，但偶然发现了一个我并不完全理解的行为。基本上，我希望在一个DIV中有一个字体图标，另一个DIV包含一个标题和一个段落元素。为了将DIV与FA图标稍微分开，我为图标指定了一个边距，但没有使用图标作为参考，而是使用父DIV的边缘作为参考

HTML:

有人知道如何在图标和DIV之间创建空间吗

更新：

---

我想让它们水平分布

你能再解释一下吗？如果我的想法正确，你想试试吗-

    #first-row .infos .info-box {
      float:left;
      padding: 5px;
      min-width: 200px;
    }
    #first-row .infos .info-keeper {
        display: inline-block;
        vertical-align: middle;
        margin-right: 15px;
    }
    #first-row .infos .info-box h3 {
      font-size: 14px;
      font-weight: bold;
      margin-top:0px; /*because of bootstrap h3 */
      margin-bottom:5px;
    }
    #first-row .infos .info-box i {
     display: inline-block;
     vertical-align: middle;
     margin-right: 15px;
    }

---

垂直对齐顶部、中部和底部，如您所愿。

内联列表非常适合对齐内容和图标，请参阅我随附的示例

注意，我已经去掉了你的类和样式来说明这一点，但是你可以带回你想要的任何东西，只需要知道我在本例中为列表元素添加了填充；你可以调整这些来适应

.inline列表{
列表样式：无；
保证金：0；
填充：0；
}
.内联列表p，
.内联列表h3{
保证金：0；
填充：0；
}
.inline list li{
显示：内联块；
填充：0.1em；
}

周一至周六：9:00-18:00
周日休息

一定要编辑你的问题，这样可以澄清你是希望图标和文本水平对齐还是垂直对齐，谢谢。你的CSS引用了你文章中没有的HTML。我知道你现在有什么吗？怎么了？在默认情况下，div将在新行上自动开始，这对我来说似乎是有空间的。如果您希望它和文本一起流动，您应该将其显示更改为inline-block。谢谢您的回答。这正是我想要的谢谢你提出来！这是另一个很好的解决方案！不客气，我和许多前台人员都用这个来处理类似的情况。：）

#first-row .infos .info-box {
  float:left;
  padding: 5px;
  min-width: 200px;
}
#first-row .infos .info-keeper{
  padding-right: 15px;
}
#first-row .infos .info-box h3 {
  font-size: 14px;
  font-weight: bold;
  margin-top:0px; /*because of bootstrap h3 */
  margin-bottom:5px;
}
#first-row .infos .info-box i {
 float:left;
 padding-right: 15px;
}

    #first-row .infos .info-box {
      float:left;
      padding: 5px;
      min-width: 200px;
    }
    #first-row .infos .info-keeper {
        display: inline-block;
        vertical-align: middle;
        margin-right: 15px;
    }
    #first-row .infos .info-box h3 {
      font-size: 14px;
      font-weight: bold;
      margin-top:0px; /*because of bootstrap h3 */
      margin-bottom:5px;
    }
    #first-row .infos .info-box i {
     display: inline-block;
     vertical-align: middle;
     margin-right: 15px;
    }