对齐文本，股利和其他2周的div水平

Question

我有：

<div id="outerDiv" style="margin: 20px;"> 
         <div id="innerDiv" style="float: left;"> 
          <span>10002</span> 

          <div class="arrow-up" alt='some text' /> 
          </br> 
          <div class="arrow-down"/> 
         </div> 
         <div><h3>Text</h3></div> 
         </br> 
         <span>Some plain text 
      <br /> 
         </span> 
        </div> 

在outerdiv的所有元素，除了纯文本跨度必须对齐，并向左浮动，但我不能想出一个办法怎么做。如果我移动了其他东西，所有其他的东西都会在整个页面上飞行什么才是正确的做法呢？附的是我想达到的图像：

Answer 1

利用这个意象结构它可以帮助ü

<div id="outerDiv" style="margin: 20px;"> 
     <div id="innerDiv" style="float: left;"> 
     <span style="float:left; margin-top:15px;">10002</span> 
     <div class=" " style="float:left;"> 
      <div class="arrow-up" alt='some text' /></div> 
      <div class="arrow-down"/></div> 
     </div> 
     <h3 style="float:left;">Text</h3> 
<div style="float:none; clear:both"></div> 
     </div> 
     </br> 
     <span>Some plain text</span> 
    </div>