Set height of content in a Bootstrap Card so that it fills the whole card block

Question

I am struggling with the layout defined here: https://jsfiddle.net/zmcode/uk97kfLm/20/.

The problem is that the red div inside the card on the right should

Answer 1

I previously explained that h-100 is height: 100%, and this only works when the container has a defined height.

https://jsfiddle.net/1vgewck9/2/

  

    

      Left Card
    
  
  

    

      

        
Right Card
        

          
.
        
      
    
    

      Right Bottom Element