javascript - 我怎样才能包装div？

Question

基本上，我希望外层 div 外面的内层 div 根据外层 div 的宽度换行，外层 div 又根据浏览器窗口的宽度扩展和收缩，如下所示:

.---------------------.
|                     | <-- Browser Window
| .-----------------. |
| |  ,-,  ,-,  ,-,  | |
| |  |X|  |X|  |X|  | |
| |  `-`  `-`  `-`  | |
| |                 | |
| |  ,-,  ,-,  ,-,  | |
| |  |X|  |X|  |X|  | |
| |  `-`  `-`  `-`  | |
| `-----------------` |
|                     |
`---------------------`

.-------------------------------.
|                               | <-- Browser Window enlarged
| .---------------------------. |
| |  ,-,  ,-,  ,-,  ,-,  ,-,  | |
| |  |X|  |X|  |X|  |X|  |X| <----- Inner divs wrap around accordingly, as if
| |  `-`  `-`  `-`  `-`  `-`  | |     they are text
| |                           | |
| |  ,-,                      | |
| |  |X|                      | |
| |  `-`                      | |
| `---------------------------` |
|                               |
`-------------------------------`

什么是实现这一目标的最佳方式(就开发人员时间而言最简单)？

Answer 1

为此 block 设置 - display: inline-block，并为主容器设置一些宽度...

  .div {
     display: inline-block;
  }

http://jsfiddle.net/guh5Z/1/