兩個動態高度相同的高分辨率

正如標題所說，我需要兩個分辨率同樣高。它們應該儘可能地高，以滿足內容的要求。目前CSS是：兩個動態高度相同的高分辨率

.portfolioleft{ 
    float:left; 
    width:189px; 
    background-color: #436FAC; 
    min-height: 100px; 
    height: auto; 
    color: #FFF; 
    padding: 20px; 
    margin-bottom: 20px; 
    border-radius: 10px; 
} 
.portfolioleft img{ 
    border-radius: 10px; 
} 
.portfolioright{ 
    float:right; 
    width:500px; 
    background-color: #436FAC; 
    min-height: 100px; 
    height: auto; 
    color: #FFF; 
    padding: 20px; 
    margin-bottom: 20px; 
    border-radius: 10px; 
} 
.portfolioright a{ 
    color:#FFFFFF; 
}

和的div的HTML是：

<div class="portfolioleft"><img src="img" alt="img" width="189" height="311" /></div> 
<div class="portfolioright"> 
<h2>Title</h2> 
<p>Text</p> 
</div> 
<div class="clear">&nbsp;</div>

來源

2012-04-19 BlackVoid

答案這個問題可能會幫助你http://stackoverflow.com/a/8741070/681807（檢查編輯） – 2012-04-19 19:05:31

重複http://stackoverflow.com/questions/9309487/auto-div-height-depend-on-another-一個/ 93103 29＃9310329 – Tarun 2012-04-20 07:30:58

CSS本身不能解決這個專長（除非你想要一個黑客解決方案，你可以使用圖像）。您將需要實施JS解決方案。由於內容是動態的，您不知道列的高度，因此您需要訪問DOM以確定最高列的高度，然後應用到指定的列。我定期使用以下內容，並且工作得很好，易於實施。在你的左，右的div

http://www.jainaewen.com/files/javascript/jquery/equal-height-columns.html

來源

2012-04-19 19:11:15 CChoma

不幸的是，這是在CSS一個棘手的問題。如果您只想將左側邊欄的背景顏色擴展到該部分的底部（其高度由右側div定義），請嘗試將其包裝在父div（縮放到右側div的高度）內，然後與位置定位的左格：絕對100％的高度，像這樣：

<div class="portfolio"> 
    <div class="portfolioleft">...</div> 
    <div class="portfolioright">...</div> 
</div> 

.portfolio { 
    position: relative; 
    background: white; 
} 

.portfolio .portfolioleft { 
    position: absolute; 
    left: 0; 
    top: 0; 
    width: 200px; 
    height: 100%; 
    background: #436FAC; 
} 

.portfolio .portfolioright { 
    margin-left: 200px; 
}

如果雙方是動態的，你既需要高度匹配，是唯一正確的方式，使其工作在所有主要的瀏覽器是採用兩列的基於表格的佈局，就像可能的那樣嚴酷。

來源

2012-04-19 18:51:29

電池性能

我檢查你的代碼並更換浮子爲顯示錶細胞

你可以檢查這個活http://jsfiddle.net/rohitazad/prMLh/1/

來源

2012-04-20 07:27:28

兩個動態高度相同的高分辨率

回答

相關問題