0

我有一张桌子max-width: 300px;。在 Mozilla Firefox、IE 和 Opera 中，如果表格的内容宽于 300 像素，它会尝试破坏它。如果它不能被破坏，它允许表格调整超过 300 像素。如何在 Google Chrome 中实现这种行为？

编辑：

<table style="max-width: 300px; background-color: yellow;">
  <tr><td>Lorem ipsum dolor sit amet consectetuer euismod nibh amet Vestibulum ornare. Natoque convallis auctor arcu ac.</td></tr>
  <tr><td>LoremipsumdolorsitametconsectetuereuismodnibhametVestibulumornareNatoqueconvallisauctorarcuac.</td></tr>
</table>

在 Firefox 中，表格的宽度为 625 像素。文本是动态生成的。

4

1 回答 1

1

只需将以下样式添加到表格或单元格中

word-break: break-all;

这将迫使工作中断，即使它没有空格并且不会破坏表格宽度，也不会强迫您在表格上设置最小宽度/宽度。

编辑：

这应该为您提供所需的行为：

<html>
<head>
    <style type="text/css">
            table {
                width: auto;
            }
    </style>
    </head>
    <body>
    <div style= "max-width: 300px">
        <table style="background-color: yellow;">
            <tr class="text"><td><div>Lorem ipsum dolor sit amet consectetuer euismod nibh amet Vestibulum ornare. Natoque convallis auctor arcu ac.</div></td></tr>
            <tr class="text"><td>  
                 LoremipsumdolorsitametconsectetuereuismodnibhametVestibulumornareNatoqueconvallisauctorarcuac.
            </td></tr>
        </table>
    </div>
    </body>
</html>
于 2013-04-07T12:06:47.597 回答