如何讓一個內部div填滿另一個div之後的剩餘空間？

如何將內部Div 寬度設定為另一個Div 後的剩餘空間

在xHTML 和CSS 中，您可能會遇到需要以下場景：在外部div 內有多個巢狀div，其定義寬度為100%。您希望內部 div 顯示在一行中，第一個 div 的寬度由其內容決定。

要實現此目的，您可以利用以下技術：

步驟1：對嵌套Div 使用內聯顯示

將嵌套的'display' 屬性設定為'inline'，以便它們出現在同一行。

步驟2：將外部Div 的溢位設定為隱藏

應用'overflow: hide;'到外部div，以確保其子元素（巢狀div）保持在其寬度內。

第3 步：將第一個巢狀Div 的寬度設定為自動

將未指定的第一個巢狀div (#inner1) 的寬度保留為“auto”。這允許它根據其內容擴展到必要的寬度。

步驟4：第二個巢狀Div 設定溢位為隱藏

套用'overflow: hide;'到第二個巢狀div (#inner2) ，以防止其超出外部div 中的剩餘空間。

範例程式碼：

<div>

其他注意事項：

為了相容於IE 6，您可能需要增加額外的CSS使用HTML 條件註釋，如所提供的答案所述。

使用此技術，內部 div 將內聯顯示，第二個 div 自動調整以佔據外部 div 中的剩餘空間。

以上是如何讓一個內部div填滿另一個div之後的剩餘空間？的詳細內容。更多資訊請關注PHP中文網其他相關文章！