允许表格在Google Chrome中的最大宽度范围内扩展

我有一个表格max-width: 300px;。在Mozilla Firefox，IE和Opera中，如果表格的内容大于300像素，则会尝试将其分解。如果它不能被破坏，它允许表格调整大小超过300像素。我如何在Google Chrome中实现这种行为？允许表格在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像素宽。文本是动态生成的。

来源

2013-04-07 IllidanS4

告诉我们你有代码，请 – caramba 2013-04-07 11:19:15

不明白为什么您使用最大宽度，如果你不想最大宽度工作。也许使用宽度，或与最小宽度的组合将有所帮助？ – pzin 2013-04-07 11:21:42

因为我不想限制最小宽度。 – IllidanS4 2013-04-07 12:03:13

就以下样式添加表或细胞

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-07 12:06:47

谢谢，我用它作为时间解决方案，但它不是我想要的。 – IllidanS4 2013-04-07 12:27:21

为什么你仍然想要使用最大宽度，如果你想浏览器不服从相同？ – 2013-04-07 13:14:48

我上面编辑了我的答案，这会给予浏览器在Chrome浏览器中所需的行为 – 2013-04-08 19:12:30

允许表格在Google Chrome中的最大宽度范围内扩展

回答

相关问题