I have a dynamic data based on which I need to show them in the email template. I used the following code to align table side by side but it is not working. I use this table inside the loop so that same table repeat again and make the layout. There is also a parent table outside of the loop to contain this dynamic table but i didn't write those code here. Let me know what I am doing wrong.

<table align="left" style="width:50%;">
  <tr>
    <td>Name</td>
  </tr>
</table>
<table align="left" style="width:50%;">
  <tr>
    <td>Name</td>
  </tr>
</table>
<table align="left" style="width:50%;">
  <tr>
    <td>Name</td>
  </tr>
</table>

CodePudding user response：

The 3th table is on the 2nd line becauses the first 2 are taking up 100% of the space.A solution is to remove the width style all together if you are using a loop to add the tables you can devide the 100 by the number of tables to get the width.

<table align="left">
  <tr>
    <td>Name</td>
  </tr>
</table>
<table align="left">
  <tr>
    <td>Name</td>
  </tr>
</table>
<table align="left">
  <tr>
    <td>Name</td>
  </tr>
</table>

Loop migth be like this

for(var i = 0;i<num;i  ){
...
table.style.width = (100 / num)   "%";
...
};

Is this what you are after?