對齊用的右側內容底部的左側的div

Question

我有如下的HTML結構：

<div class="pagebody"> 
<div class="pageleft"> 
     <div class="sidebarmenu"> 
     </div> 
     <div class="sidebarbottom"> 
     </div> 
</div> <!-- end pageleft --> 

<div class="pageright"> 
     ... 
     ... 
     ... 
</div> <!-- end pageright --> 

<div class="clear"></div> 

</div> <!-- end pagebody --> 

的CSS是

.pagebody { 
width:960px; 
text-align:left; 
margin:0 auto; 
} 
.pageleft { 
width:333px; 
float:left; 
position:relative; 
padding:24px 0 0 37px; 
min-height:100%; 
height: auto !important; 
height: 100%; 
margin: 0 auto -301px; 
} 
.pageright { 
width:590px; 
float:right; 
padding-top:29px; 
min-height:1200px; 
} 
.sidebarmenu { 
margin-right:72px; 
font:15px Helvetica, Arial, sans-serif; 
} 
.sidebarbottom { 
margin-left:10px; 
position:absolute; 
bottom:0; 
    height:301px; 
} 

在「頁面版權歸」內容是不固定的高度和變化。我想將'sidebarbottom'與'pageright'的底部對齊。嘗試與位置絕對&相對但不工作。

任何幫助？

Answer 1

我找到了解決辦法是什麼。

下面< DIV CLASS = 「pagebody」 > </DIV >會有另外的重複： -

<div class="pagebody"> 
    <div class="pageleft"> 
    <div class="sidebarmenu"> 
    </div> 
    </div> <!-- end pageleft --> 

    <div class="pageright"> 
    ... 
    ... 
    ... 
    </div> <!-- end pageright --> 

    <div class="clear"></div> 

</div> <!-- end pagebody (1) --> 

<div class="pagebody"> 
    <div class="pageleft"> 
    <div class="sidebarbottom"> 
    </div> 
    </div> <!-- end pageleft --> 

    <div class="pageright"> 
    &nbsp; 
    </div> <!-- end pageright --> 

    <div class="clear"></div> 

</div> <!-- end pagebody (2) --> 

這工作！

Answer 2

這是你努力實現http://jsfiddle.net/2cUJS/