Click here to Skip to main content
15,899,124 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I am using row and colum bootstrap4.Inside of colum child div i am give height:100% but it take full height?


I am using bootstrap 4.In ipad div(.
full-heigt
) height 100% not appearing.Please help me.

What I have tried:

<div class="container">
<div class="row">
<div class="col-md-6">
<p>test</p>
</div>
<div class="col-md-6 full-heigt">
<p>test test test test</p>
</div>
</div>
</div>
.full-heigt{
height:100%;
background:#000;
}

.full-heigt height:100% not appear.
Posted
Updated 18-Dec-18 6:45am
Comments
CHill60 18-Dec-18 12:17pm    
Try spelling it as ".full-height"

1 solution

height: 100%; means it will take the full height of the containing element. You would need to make sure that every ancestor of the element - including the html and body elements - was tall enough for your requirements.

If you just want the element to take 100% of the viewport height, then use height: 100vh; instead.

Viewport units: vw, vh, vmin, vmax - Web Design Weekly[^]
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900