使HTML表格足夠寬以適應內容

我運行一個腳本來生成一個HTML頁面，但我無法正確格式化生成的表格。需要製作一張必要的寬度很寬的桌子。目前，我必須指定一個特定的寬度（1500px），以便每個單元格的內容不會換行到下一行。這裏有一個例子：使HTML表格足夠寬以適應內容

With width set to 1500px: 
+-----------------------------+------------------------------+ 
|Contents of my cell   | Contents of other cell  | 
+-----------------------------+------------------------------+ 

With width set to 100%: 
+-------------------+--------------------+ 
|Contents of my  |Contents of other | 
|cell    |cell    | 
+-------------------+--------------------+

理想情況下，我的文字不會換行（例如，當寬度設置爲1500px。），但不會有設置靜態表格的寬度。有時，桌子可能需要比1500更寬（或更小），所以我希望寬度儘可能動態。

這是在CSS我目前使用：

<style type="text/css"> 
h1 { 
    text-shadow: rgba(255, 255, 255, 0.796875) 0px 1px 0px; 
    font-family: Georgia,"Times New Roman","Bitstream Charter",Times,serif; 
    font-weight: normal; 
    padding: 7px 7px 8px; 
    text-align: left; 
    line-height: 1.3em; 
    font-size: 24px; 
} 
table { 
    border: 1px solid #DFDFDF; 
    background-color: #F9F9F9;-moz-border-radius: 3px; 
    -webkit-border-radius: 3px; 
    border-radius: 3px; 
    font-family: Arial,"Bitstream Vera Sans",Helvetica,Verdana,sans-serif; 
    color: #333; 
    width: 1500px; 
} 
th { 
    text-shadow: rgba(255, 255, 255, 0.796875) 0px 1px 0px; 
    font-family: Georgia,"Times New Roman","Bitstream Charter",Times,serif; 
    font-weight: normal; 
    padding: 7px 7px 8px; 
    text-align: left; 
    line-height: 1.3em; 
    font-size: 14px; 
    color: #555; 
} 
td { 
    font-size: 12px; 
    padding: 4px 7px 2px; 
    vertical-align: bottom; 
    border-right: 1px solid #DFDFDF; 
} 
</style>

我如何能做到這一點任何想法？

來源

2012-11-15 EGr

嘗試添加'''html，body {width：100％;}'''到你的css。如果是因爲你的身體沒有寬度，不會感到驚訝。還要確保你有一個聲明的文檔類型。 –

如果您嘗試使線條從不換行，請嘗試使用white-space：nowrap並從表格中刪除寬度。

td { 
    font-size: 12px; 
    padding: 4px 7px 2px; 
    vertical-align: bottom; 
    border-right: 1px solid #DFDFDF; 
    white-space:nowrap; 
}

來源

2012-11-15 21:28:12 MikeSmithDev

工作，非常感謝！我不經常使用CSS，所以我不知道很多CSS屬性。 – EGr

使HTML表格足夠寬以適應內容

回答

相關問題