0

我有一个表格，但详细信息列没有换行，表格比屏幕宽，使用水平滚动条很烦人。为什么会发生这种情况？请问我该如何解决？我的代码如下。

任何帮助深表感谢。

提前问候和感谢，韦斯利

<table width="90%">
    <tr>
        <td class="row" colspan="3"><strong>Follow-Up History</strong></td>
    </tr>
    <tr>
        <td width="15%"><b>Consultant</b></td>
        <td width="65%"><b>Details</b></td>
        <td width="20%"><b>Date</b></td>
    </tr>
    <?
        $mydb = mysql_connect('localhost', 'root', 'elves');
        $q3 = "select * from clientcare.subcalls where callid = '$cID' order by `date` ASC";
        $r3 = mysql_query($q3, $mydb) or die("Query q3 died");
        while ($row3 = mysql_fetch_array($r3)) {
            $scConsultant = $row3["consultant"];
            $scDetails = $row3["details"];
            $scDate = $row3["date"];
    ?>
            <tr>
                <td width="15%"><?= $scConsultant; ?></td>
                <td width="65%"><?= $scDetails; ?></td>
                <td width="20%"><?= $scDate; ?></td>
            </tr>
            <tr><td colspan="3"><hr></td><td>&nbsp;</td></tr>
    <?
        }
        mysql_close($mydb);
    ?>
</table>
4

3 回答 3

3

您应该使用 CSStable-layout: fixed;属性并应用于width您的table

你会看到这样的东西——

不换行<td>-文本不换行（如果字符串没有任何空格）

否则，如果字符串有像这个小提琴这样的空格，这没关系

但要确保你td不会溢出长字符串

使用以下属性将表中的数据包装起来<td>以包装长字符串：

table {
   table-layout: fixed;
   width: /* Whatever You Like */ ;
}

td { 
   white-space: pre-wrap;      /* CSS3 */   
   white-space: -moz-pre-wrap; /* Firefox */    
   white-space: -pre-wrap;     /* Opera <7 */   
   white-space: -o-pre-wrap;   /* Opera 7 */    
   word-wrap: break-word;      /* IE */
}

我最后的小提琴（带空格的字符串）

我最后的小提琴（没有空格的字符串）

PS您也可以<td>像这样修复宽度：fiddle

于 2012-07-27T07:00:20.197 回答
0

最后一个 tr 的结构错误，

<tr><td colspan="3"><hr></td><td>&nbsp;</td></tr>

正确的结构

<tr><td colspan="3"><hr></td></tr>
于 2012-07-27T11:18:56.053 回答
0

设置max-width，否则如果它不适合表格将扩展

<table style="max-width: 90%;">
于 2012-07-27T07:03:41.060 回答