100% lewy górny pasek boczny z dynamiczną właściwą treścią - Bootstrap + Wordpress

Question

Robię stronę internetową za pomocą Bootstrap i Wordpress. To układ 2-kolumnowy - lewy pasek boczny, właściwa treść. Właściwa treść jest dynamiczna i rozwija się w nieskończonym przewijaniu. Próbowałem zrobić lewy pasek boczny 100% wysokości za pomocą kilku technik, ale bez skutku.

Chciałbym, aby pasek boczny był kontynuowany w dół w zależności od rozmiaru rzutni/wysokości odpowiedniego elementu div.

Zrobiłem gołe skrzypce: http://jsfiddle.net/ydPMr/3, ale byłoby lepiej, gdybyś zobaczył, o czym mówiłem na mojej stronie dev: http://joshuawalker.koding.com.

Oto podstawowa struktura mojej stronie:

<div class="navbar navbar-inverse navbar-static-top"> 
<div class="navbar-inner"></div> 
</div> 
<div class="wire-unit hero-fix"> 
</div> 
<div class="sidebar hidden-phone"></div> 
<div class="content"></div> 

Jeśli ktoś ma jakieś pomysły, jak uczynić bocznym aby rozciągnąć pełnej wysokości, byłbym wdzięczny.

Dzięki!

Answer 1

To działa dobrze dla mnie. Fiddle

ustawić min-Height do 500px. Jeśli nie chcesz minimum, usuń go. Będzie działać zgodnie z height Twojej zawartości w content div. Podoba Ci się to Fiddle

<div class="wrapper"> 
    <div class="sidebar hidden-phone"> 
    </div> 
    <div class="content"> 


    </div> 
</div> 

i stylu

<style type="text/css" > 
    .wrapper 
    { 
     min-height:100%; 
     width:100%; 
     position:relative; 
     background-color:Black; 
     display:inline-block; 
    } 
    .sidebar 
    { 
     width:20%; 
     top:0px; 
     left:0px; 
     bottom:0px; 
     position:absolute; 
     background-color:Aqua; 
    } 
    .content 
    { 
     min-height:500px; 
     width:80%; 
     position:relative; 
     background-color:Gray; 
     float:right; 
    } 
</style>