Are you first timer at lazacode.org? Why not join us and start exchange your programming knowledge with everyone. Register today!

CSS - bring left column to bottom on mobile on flex row property with flex-flow reverse

0 votes
76 views
added Mar 23 in CSS by lcjr First Warrant Officer (8,030 points)
<div className="row no-gutters box-mid reverse">
  <div className="col-12 col-lg-7 bg-5">
    <h4>This go bottom</h4>
  </div>
  <div className="col-12 col-lg-5">
    <img src={`${assets}mid5.png`} />
  </div>
</div>

<style>
 .box-mid {
   display: flex;
    &.reverse {
      @media (max-width: 991px) {
        flex-flow: column-reverse;
      } 
    }
  }
</style>

 

Please log in or register to response this reference.

lazacode.org - Malaysia's programming knowledge sharing platform, where everyone can share their finding as reference to others.
...