JSFiddle - React, Tailwind, and code Playground

by David Sch

HTML

<!-- END: DS MANUAL CODE INSERTION -->
  <div class="ingredients-mobile">
    <div class="ingredients-box-mobile">a</div>
        <div class="ingredients-box-mobile">b</div>
        <div class="ingredients-box-mobile">c</div>
            <div class="ingredients-box-mobile">d</div>
                <div class="ingredients-box-mobile">e</div>
                    <div class="ingredients-box-mobile">f</div>
                        <div class="ingredients-box-mobile">g</div>
                            <div class="ingredients-box-mobile">h</div>
</div>

CSS

body {
      background-color: #000;
      color: #fff;
    }
    
.ingredients-mobile {
display: flex;
 border: 0px #fff solid;
  flex-wrap: wrap;
  width: 100%;
 
 }

 .ingredients-box-mobile {
   border: 0px #fff solid;
   flex: 50%;
 }