允許表格在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中的最大寬度範圍內擴展

回答

相關問題