怎么让 div 内的 li 能根据浏览器的宽度自动换行呢？

[1etters]

做了一个单页，在全屏浏览的时候没有问题，但是当浏览器宽度变小的很多的时候就只能显示网页左边的内容，右边的需要水平拉动才能看，在手机上那就更惨不忍睹了！
有什么办法能让div内的多个li自动换行呢？

[NemoAlex]

Width: 100%

[Csineneo]

<code>word-wrap: break-word; word-break: break-word;</code>

[1etters]

@Csineneo 我是图片

[1etters]

@NemoAlex 试过

[jsonline]

响应式

[Csineneo]

@1etters max-width

[wsph123]

唔 Mark 好像遇到相同问题了

[raincious]

1、Body设定固定宽度，完全不理会手机用户（事实上设定一个小于1000px的固定宽度手机用户横屏也能凑合看，我之前花半天做来玩的页面 http://t.cn/RhyYjHm ，没想到拿手机横着看也凑合），适合不想认真做或者要求非常不高/时间紧的方案。

2、响应式。用media query做两套方案。但是要求CSS编写灵活，需要一定技巧。
刚还敲了一段代码，但是猛然还是觉得丢个链接就好：
http://getbootstrap.com/

[pgfast]

你需要的不是让 div 内的 li 能根据浏览器的宽度自动换行
而是外层容器的宽度自适应。简单点就设置成百分比就可以了。

[liaa]

```html
<meta name="viewport" content="width=device-width">
```

给楼主一个建议. 要让大家帮忙最好给个 demo 啊.

[1etters]

@liaa好来！ demo在这 anytouch.org

[1etters]

@raincious OK！我必须尝试下

[1etters]

@pgfast 我也这么怀疑！准备把多个外层都用百分比

[1etters]

@pgfast 刚刚试过了 外层容器百分比还真没用

[liaa]

@1etters =,= 刚刚我在调教你的网站...没想到你也同时在调教... 结果刚调好刷新下就变了

[1etters]

@liaa 汗！我现在不动了！

[liaa]

@1etters 现在看不是好了麦... 把.row 上面的左右 margin 去掉就完全没有横向滚动条了

[1etters]

@liaa 我这里还是不行啊，刚刚去掉了row的margin

[1etters]

@liaa 我明白了！这样是随浏览器宽度缩放！其实我之前是想让它换行。你看我是有三个li标签

[liaa]