最近弄了一個動態添加div框，每個div框內容有多有少，要支持div高度自適應，還要添加的div自動追加，並且換行還要保持每行對齊。
剛開始的效果：
要改啊，搞不定，問了UI高手，終於給出了完美解決方案：
效果：
因為要支持每個div可刪除，刪除后，后面的div自動補齊，所以用table不顯示（除非想自虐的人可以試下）
最終就是css修改了一下就搞定了，術業專攻啊。。。
<html> <head> <style> .test_area{ width:100%; background-color:#FFFFFF; min-height:120px; overflow: auto } .test_ans{ background-color:#ebebeb; //float:left; margin-left:10px; margin-top:5px; margin-bottom:5px; min-height:100px; width:200px; border:1px solid #808080; border-radius:10px; text-align: left; cursor:move; position:relative; vertical-align: top; display:inline-block; } .test_desc{ width:100px; margin-left:10px; margin-top:10px; float:left; word-break:break-all; line-height: 1.5; } </style> </head> <div class="test_area" style="width:809px"> <div class="test_ans"> <div class="test_desc" > <font color="#000000">1231 2312 312 31 2123123 123 123 123 123 123 123 123123 12312 3123 123 123 123 123 1212</font> </div> </div> <div class="test_ans"> <div class="test_desc"> <font color="#000000">1231 232</font> </div> </div> <div class="test_ans"> <div class="test_desc"> <font color="#000000">1231 2312 312 31 312312</font> </div> </div> <div class="test_ans"> <div class="test_desc"> <font color="#000000">1231 2312 312 31 123 123123 123123 12312312</font> </div> </div> <div class="test_ans"> <div class="test_desc"> <font color="#000000">1231 2312 312 31 123 123 123 123 123 123123 123123 12312312</font> </div> </div> <div class="test_ans"> <div class="test_desc"> <font color="#000000">1231 2312 312 31 2123123 123123 123123 12312312</font> </div> </div> <div class="test_ans"> <div class="test_desc"> <font color="#000000">1231 2312 312 31 123 123123 123123 12312312</font> </div> </div> </div> </html>
完工！