<br> not working within an #each loop in a handlebars html template file

Question

Following is the code from a .hbs file to create multiple tables one after another. At the end there are two <br> tags to ensure two line breaks between the different tables created

{{#each container}}
    <div>
      <table class="table table-responsive table-condensed table-bordered" style="margin-left:0px;float: left;align:left;">
        <thead>
          <tr>
            <th style="color:rgb(68, 67, 67);font-weight: normal;">...</th>
          </tr>
        </thead>
        <tbody>
          {{#each variable}}
            <tr>
              <td style="border:none;">...</td>                  
            </tr>
          {{/each}}
        </tbody>
      </table>
    </div>
    <br><br>
{{/each}}

But after using this hbs to create an html page, the two line breaks are not visible. How to get this working?

Answer 1

Instead of br use inline style and add margin-bottom

     {{#each container}}
            <div style:"margin-bottom:30px;">
              <table class="table table-responsive table-condensed table-bordered" style="margin-

left:0px;float: left;align:left;">
            <thead>
              <tr>
                <th style="color:rgb(68, 67, 67);font-weight: normal;">...</th>
              </tr>
            </thead>
            <tbody>
              {{#each variable}}
                <tr>


        <td style="border:none;">...</td>                  
            </tr>
          {{/each}}
        </tbody>
      </table>
    </div>
    {{/each}}