ho questa situazione una colonna "colum1" con dentro 2 div "widget"

<div class="colum1">
<div class="widget" draggable="true">
<header><span>Titolo1</span></header>
<div id="widget1" class="widget-main" style="display:block;">box1</div>
</div>
<div class="widget" draggable="true">
<header><span>Titolo2</span></header>
<div id="widget2" class="widget-main" style="display:block;">box2</div>
</div>
</div>
vorrei che i 2 div occupassero l'intera colonna

.colum1 {
position: relative;
height: auto;
min-height: 100%;
width: 20%;
}
in questo modo la colonna occupa tutto lo spazio a lei a disposizione e fino qui TUTTO OK
poi ho provato a mettere
.widget {
position:relative;
height: auto;
min-height: 50%;
}
per far occupare ai 2 div il 50% cad. dello spazio all'interno della colonna....... ma non funziona....perche???
Attenzione ho una funzione che nascondende uno dei 2 div mettendo display:none
e a quel punto l'altro div rimanente dovrebbe occupare l'intero spazio height... come posso fare???