为什么我的表单生成的用户注释扩展到固定宽度表和div的边界之外?

时间:2013-09-25 16:46:18

标签: html css html-table

我应该这样说,我已经尝试过在本网站上发现的类似问题(例如Set the table column width constant regardless of the amount of text in its cells?)的几个修复无效。

我通过AJAX生成用户评论表(每个表1条评论)。简而言之,输入文本和单击按钮调用AJAX函数,该函数访问php文件;然后,php文件根据我开发的算法按时间顺序显示用户注释。工作正常......(最新的相关代码如下)

$current.="<table border=\"1\" width=\"550px\" table-layout=\"fixed\">";
$current.="<tr width=\"550px\">";
$current.="<td width=\"60px\"><img src=\"" . $Picture1 . "\" style=\"float:left\"    
width=\"50px\" style=\"border: 0\" height=\"55px\"></td>";
$current.="<td width=\"485px\">";
$current.="<div style=\"width:485px\"><font size = \"2\" style=\"font-   
family:arial\">&nbsp;&nbsp;&nbsp<b>$user1</b></font>&nbsp;&nbsp;&nbsp";
$current.="<font size = \"2\" style=\"font-family:arial\">$usercomment1</font>";
$current.="</div></td>";
$current.="</tr>";
$current.="</table>";

除用户注释超出表格的水平边界(宽度)(约60个字符)外。请注意,如上所示,表格单元格中没有div 的(并将每个td,tr和table元素设置为固定宽度),注释会将表格的边界扩展到右侧(由显示边界)。令人惊讶的是,使用上面的代码(即包含div ),用户注释的文本实际上超出了表格(文本实际上只是写在右边的表格边框上,就像它不是即使在那里并继续向右移动,就像div /文本具有更高的z-index一样。)

现在,我快速而又脏的修复是为生成用户注释的表单的输入文本字段设置maxlength ='60',但我不喜欢这种方法,因为将字符限制为60就像Twitter一样-lite。关于为什么我的桌子问题发生的任何想法?

2 个答案:

答案 0 :(得分:0)

尝试使用省略号作为文本

.ellipsis {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
-o-text-overflow: ellipsis;
}

它会帮助文本不会溢出,尝试使用overflow属性

答案 1 :(得分:0)

通过更多测试,我能够使用wordwrap()函数以我需要的方式自动插入换行符:

http://www.php.net/manual/en/function.wordwrap.php

像魅力一样工作