html - CSS height: 100% not working on inline-block element although parent div has height -


i have div has 2 child divs inside it, so:

<div id="cartgrid" style="display:inline-block">     <div class="cart-left">         ....     </div>     <div class="cart-right">         ....     </div> </div> 

the .cart-left holds table of items, while .cart-right has few buttons, .cart-left taller .cart-right; height of parent div determined height of .cart-left. want .cart-right have same height .cart-left, gave height:100%, though parents (#cartgrid) has height value, height:100% nothing.

fiddle: https://jsfiddle.net/zjuzh07n/

a bit dirty, that's how fix it.

#cartgrid {   position: relative;   display: inline-block; }   .cart-right {     position: absolute;     display: inline-block;     right: 0;     height: 100%;   } 

hope might help.


Comments

Popular posts from this blog

Fail to load namespace Spring Security http://www.springframework.org/security/tags -

sql - MySQL query optimization using coalesce -

unity3d - Unity local avoidance in user created world -