CSS延伸超出最大寬度

-3

我已經在兩個位置設置了最大寬度，但表格繼續延伸到遠遠超出這些值。我究竟做錯了什麼？CSS延伸超出最大寬度

樣品CSS：

#WADAPageTitleArea { 
    /* width: 555px; */ 
} 
#WADAPageTitleArea div, #WADAPageTitleArea p { 
    font-size: 11px; 
    padding-bottom: 7px; 
} 
#WADAPageTitleArea div#WADAPageTitle, #WADAPageTitle { 
    font-size: 14px; 
    font-weight: bold; 
} 

.WADAResults, .WADANoResults { 
    border-top: 1px solid #AEBBC2;max-width:300px !important; 
} 
.WADAResultsNavigation { 
    padding-top: 5px; 
    padding-bottom: 10px; 
} 
.WADAResultsCount { 
    font-size: 11px; 
} 
.WADAResultsNavTop, .WADAResultsInsertButton { 
    clear: none; 
} 
.WADAResultsNavTop { 
    width: 60%; 
    float: left; 
} 
.WADAResultsInsertButton { 
    width: 30%; 
    float: right; 
    text-align: right; 
} 
.WADAResultsNavButtonCell, .WADAResultsInsertButton { 
    padding: 2px; 
} 
.WADAResultsTable { 
    font-size: 11px; 
    clear: both; 
    padding-top: 1px; 
    padding-bottom: 1px; 
    max-width:300px !important; 
} 

.WADAResultsTableHeader, .WADAResultsTableCell { 
    padding-right: 7px; 
    padding-left: 7px; 
    text-align: left; 
} 

.WADAResultsTableHeader { 
    padding-left: 14px; 
    padding-right: 14px; 
} 

.WADAResultsTableCell { 
    padding-left: 7px; 
    padding-right: 7px; 
} 

.WADAResultsTableCell { 
    border-left: 1px solid #AEBBC2; 
} 

.WADAResultsEditButtons { 
    border-left: 1px solid #AEBBC2; 
    border-right: 1px solid #AEBBC2; 
} 

.WADAResultsRowDark { 
    background-color: #DCE4ED; 
}

表編號：

<table class="WADAResultsTable" border="0" cellpadding="0" cellspacing="0"> 
      <tr> 
      <th class="WADAResultsTableHeader" style="">Species:</th> 
      </tr> 
      <?php do { ?> 
      <tr class="<?php echo $WARRT_AltClass1->getClass(true); ?>"> 
       <td class="WADAResultsTableCell" style="word-wrap:break-word"><strong><?php echo($row_WADAFL_Regs['Species']); ?></strong><br /><img style=" " src="/tides/florida-fish/images/<?php echo($row_WADAFL_Regs['Photo']); ?>" /><HR /> 
       Minimum Size Limits: <?php echo($row_WADAFL_Regs['Minimum_Size_Limits']); ?><BR /> 
       Closed Season: <?php echo($row_WADAFL_Regs['Closed_Season']); ?><BR /> 
       Daily Rec Bag Limit: <?php echo($row_WADAFL_Regs['Daily_Rec_Bag_Limit']); ?><BR /> 
       Remarks: <?php echo($row_WADAFL_Regs['Remarks']); ?></td> 
      </tr> 
      <?php } while ($row_WADAFL_Regs = mysql_fetch_assoc($WADAFL_Regs)); ?> 
     </table>

來源

2017-10-19 Rocco The Taco

請點擊這裏包括相關的源代碼，這樣您的網站更新後問題仍然是有用的，或見被脫機，等問] –

添加'顯示：塊; overflow：hidden;'到你的'table'元素 – Signo

尋求代碼幫助的問題必須包含在問題本身**中再現它所需的最短代碼**，最好在** Stack Snippet **中。雖然您提供了一個鏈接，但如果它變得無效，那麼您的問題對於其他未來具有相同問題的SO用戶將沒有任何價值。請參閱[**我網站上的某些內容不起作用，我可以只粘貼一個鏈接**]（http://meta.stackoverflow.com/questions/254428/something-in-my-web-site-or-project-犯規，工作可以-I-剛剛糊一個鏈接到它）。 –

一個解決可能會設置一個ID爲圖像，並在設定的最大寬度爲ID，因爲從檢查圖像看來，你所設置的最大寬度似乎被推翻

像這樣在html：

<img id="fish-img" src="image.png">

而且在CSS：

#fish-img { 
    max-width: 300px; 
}

來源

2017-10-19 11:02:51 jcyl

的min-width/max-width屬性適用於浮動和絕對定位塊和inline-block元件，以及一些固有控件。它們不適用於非替換內聯元素，例如錶行和行/列組。（A「改爲」元素有其內在的尺寸，如IMG或文本域）

您應該使用爲table元素得到<td>的後裔max-width性質的工作。

table { 
    table-layout: fixed; 
}

來源

2017-10-19 11:08:46 Balwant

CSS延伸超出最大寬度

回答

相關問題