将物品放在中间div的彼此之下

<div id="container" style="width:100%;">

  <div id="text1" style="width:20%;float:left;">1<br>1</div>
  <div id="text3" style="width:20%;float:right;">3<br>3</div>   

  <div style="width:60%;float:none;">
     <textarea id="phrases" cols="50" rows="20"></textarea>
     <div id="text2">2<br>2</div>
  </div>  

</div>

I wish to have 3 columns. In the middle column, I wish to have a textarea and then text directly under the textarea. However, the text 2<br>2 is appearing in the left column. What am I doing wrong?

我希望有3列。在中间栏中,我希望有一个textarea,然后直接在textarea下面发短信。但是,文本2
2出现在左列中。我究竟做错了什么?

http://jsfiddle.net/z7UXW/22/show/

1 个解决方案

#1

see this, Demo

看到这个,Demo

<div id="container" style="width:100%;">
  <div id="text1" style="width:20%;float:left;">1<br>1</div>

  <div style="width:60%;float:left;">
     <textarea id="phrases" cols="50" rows="20"></textarea>
     <div id="text2" >2<br>2</div>
  </div>  

  <div id="text3" style="width:20%;float:right;">3<br>3</div>  
</div>