Journal: Software Development

Email: mail@appsoftware.com

Software development notes and articles

A journal for sharing all things software development related


Full height columns

Thu, 13 Jun 2019 08:28 UTC

Source:

https://stackoverflow.com/questions/19089384/twitter-bootstrap-3-two-columns-full-height

https://codepen.io/danield770/pen/eWBXoY?editors=1100

HTML: CSS:

<div class="container h-100">header
  <div class="row h-100">
    <div class="col-md-3">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has </div>
    <div class="col-md-9">col2</div>
  </div>
</div>

CSS:

body, html {
    height: 100%;
}
.container {
        background: green;
}

.col-md-3 {   
        background: pink;
}
.col-md-9 {
        background: yellow;      
}

The information on this site is provided “AS IS” and without warranties of any kind either express or implied. To the fullest extent permissible pursuant to applicable laws, the author disclaims all warranties, express or implied, including, but not limited to, implied warranties of merchantability, non-infringement and suitability for a particular purpose.