css - 水平对齐文本、div 和 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>

除了纯文本的 span 之外，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>