將背景圖像設置爲100％高度

我想設置頁面內容的背景。帶背景圖片的div有class=history。所有上面的「歷史」和歷史本身的高度都設置爲100％。然而，「歷史」分區沒有得到正確的高度。將背景圖像設置爲100％高度

以下是代碼示例。我可能會錯過一些相關的細節，但一旦找到解決方案就會添加它們。另見the live page。

的CSS：

html, body { 
    height: 100%; 
    background: url(cream_dust.png) repeat 0 0; 
}

的HTML：

<html> 
<body class="page page-id-41 page-child parent-pageid-8 page-template-default logged-in admin-bar"> 
<div class="wrapper-for-footer"> 
<div id="page" class="hfeed site"> 
<div id="main" class="site-main"> 
<div id="primary" class="content-

來源

2012-12-26 FredTheLover

你可以添加一些HTML標記的問題？這樣，即使您已修復鏈接的網站，未來的訪問者也會有所收穫。 – Jeroen

被設置爲height: 100%只會佔用100％，其母公司的垂直空間的元素。如果在history和body之間有一個沒有高度的元素，那麼它不會像你期望的那麼高。

history元素的大部分是浮動內容，因此它已摺疊爲僅包含非浮動內容。

爲history元素添加一個清晰的修正。

overflow: hidden

或

.history { 
    zoom: 1; // fix for IE 
} 

.history:after { 
    content: ' '; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden; 
}

來源

2012-12-26 01:06:30 cimmanon

您可能需要增加position:absolute;到div您要給予高度的100％。

編輯：你需要添加position:absolute;到historydiv

來源

2012-12-26 00:43:28 rcorrie

這似乎是一個解決方案。它可以工作，但會把其他所有東西都弄亂爲什麼這個工作？ – FredTheLover

這就是'div'的工作方式。爲了達到100％的高度，你必須使用絕對定位。其他錯誤源自另一個根。讓我看看，看看我是否發現了一些東西。 – rcorrie

我找到了你的解決方案...從''中刪除'height：100％;'然後在你的CSS中，設置爲： '.page-id-41 {background：url（'http：.your-images ..png'）！important;}' – rcorrie

將背景圖像設置爲100％高度

回答

相關問題