Html 如何在CSS中对齐多个文本和图像

请查看我的问题的屏幕截图：

这是html代码：

   <div class="parent_process">  
      <div class="first_process"><img src="images/exprimer-besoin-telephonie.png"/><span style="width:18%">Vous remplissez le formulaire pour exprimer votre besoin (env 1 min)</span></div>  
      <div class="second_process"><img src="images/contacter-tous-les-vendeurs-autocommutateurs.png"/><span style="width:18%">Vous remplissez le formulaire pour exprimer votre besoin (env 1 min)</span></div>  
     <div class="third_process"><img src="images/recevoir-offre-standard-telephonique-pas-cher.png"/><span style="width:18%">Vous remplissez le formulaire pour exprimer votre besoin (env 1 min)</span></div>  
</div>

我如何拥有我的3个专栏： 1） 我的课文1 | 2）我的课文2 | 3）我的课文3

有人能帮忙吗

---

关于

我建议使用bootstrap作为css框架。他们有一个很好的专栏系统

css就像

col-sm-4

一样简单

<div class='col-sm-4'>
    <img src='http://ethanwiner.com/Smiley%20Land/Frenchie.gif' />some type of stuff that you can type some type of stuff that you can type</div>
<div class='col-sm-4'>
    <img src='http://ethanwiner.com/Smiley%20Land/Frenchie.gif' />some type of stuff that you can type some type of stuff that you can type</div>
<div class='col-sm-4'>
    <img src='http://ethanwiner.com/Smiley%20Land/Frenchie.gif' />some type of stuff that you can type some type of stuff that you can type</div>

一些你可以输入的东西一些你可以输入的东西
一些你可以输入的东西一些你可以输入的东西
一些你可以输入的东西一些你可以输入的东西

您的三个容器的宽度正确，但是

空白：nowrap

样式阻止文本换行。所以溢出显示它只是溢出

如果删除

空白：nowrap

，文本将保持在容器的宽度内。但是，您会注意到一个新问题。这些列不适合一行：

这是因为列之间几乎没有空格，甚至一个字符也没有空格。使用

内联块

，这会导致它们换行

您可以删除div之间的所有空白，它们将适合：

不过，这对于格式化来说并不太好。另一种方法是将容器的字体大小设置为0.1px。这样，即使使用格式化的标记，它也会适合：

---

空白：nowrap不允许文本换行，则内容与其他内容重叠。如果要使用
空白：nowrap
而不与其他文本重叠，则需要类似
溢出：自动
。
<div class='col-sm-4'>
    <img src='http://ethanwiner.com/Smiley%20Land/Frenchie.gif' />some type of stuff that you can type some type of stuff that you can type</div>
<div class='col-sm-4'>
    <img src='http://ethanwiner.com/Smiley%20Land/Frenchie.gif' />some type of stuff that you can type some type of stuff that you can type</div>
<div class='col-sm-4'>
    <img src='http://ethanwiner.com/Smiley%20Land/Frenchie.gif' />some type of stuff that you can type some type of stuff that you can type</div>