（工作笔记）table中td内容换行问题

 table也是我们常用的一种布局形式，今天就发现网站有一个样式的小bug，我们有一个字段叫专长，原本是里面填写词组的，但是不巧的是有一位用户恶意填写了不间断的英文字符，例如l：lovelovelovelovelovelovelovelovelovelovelovelove这样的，于是乎，我们的td就被无情的撑开了，无法换行，⊙﹏⊙

 

解决方案：

一般有两种：就是td里面再套一个div，然后设置这个div的word-break：all，或者什么，网上很多

 

第二种是针对表格：首先要将table的宽度设置为100%，然后把表格的sytle的table-layout：fixed，就是表格固定宽度，就是表格即要自适应他外面的容器，也不要撑出去，然后设置td的word-wrap：break-word；换行，问题就解决了。

 

 

 

相关资料参考：

 

蓝色理想：http://www.blueidea.com/tech/web/2006/3469.asp

 

 

w3school关于table-layout属性的解释：http://www.w3school.com.cn/css/pr_tab_table-layout.asp