包含一個圖像，其大小是動態的Div

我正在研究這種模態圖像查看器。問題是，我無法添加一個div，這將是一個圖像的容器。我需要這個div，因爲我想在其中添加導航按鈕。重點是根據瀏覽器大小調整圖像大小。最大高度：80％;被設置爲圖像的CSS。 我需要div的大小與圖像的大小相同。 請告訴我該怎麼做。包含一個圖像，其大小是動態的Div

下面是HTML

<div id="imagePlaceholderContainer"> 
    <img id="imagePlaceholder" src="images/full/Full28.jpg" /> 
</div>

這裏是CSS

#imagePlaceholder { 
    margin: auto; 
    position: fixed; 
    top: 0; 
    left: 0; 
    bottom: 0; 
    right: 0; 
    z-index: 999; 
    max-height: 80%; 
    border: 5px solid black; 
}

感謝。

來源

2013-11-04 Marc Andre Jiacarrini

您需要的樣式應用到div而不是圖像

#imagePlaceholderContainer { 
    margin: auto; 
    position: fixed; 
    top: 0; 
    left: 0; 
    bottom: 0; 
    right: 0; 
    z-index: 999; 
    max-height: 80%; 
    border: 5px solid black; 
} 

#imagePlaceholder { 
    height:100%; 
    width:100%; 
}

的jsfiddle：http://jsfiddle.net/R49mW/

你叉從重複的問題小提琴：http://jsfiddle.net/wwbd4/

來源

2013-11-04 02:32:21 keeg

有一個小問題。該div正在擴展到相同大小的瀏覽器和圖像也是100％。我需要的圖像大小是最大高度80％和div只是包含它.. –

我已經把jsfiddle你看。它正在工作，你有其他代碼可能是干擾嗎？ – keeg

我用小提琴再次提出了這個問題。看到這裏http://stackoverflow.com/questions/19761308/how-can-i-resize-the-div-dynamically-according-to-the-containing-image-size –

包含一個圖像，其大小是動態的Div

回答

相關問題