MailChimp custom template problems with drag and drop blocks - email

Question

I am creating a custom MailChimp template but having issues when using the mc:repeatable element. I have it on a wrapped around a block of code and in the editor when creating a campaign, it works fine, I can spawn a new version of the parent block and move it around in the template, but when I preview, or send the email, the child block that was spawned from the parent sits below it's parent and not where I have placed it following spawning it from the parent block... Something seems to be wrong? (Heavily simplified) Code example below... Anyone any ideas on the fix???
<!-- BLOCK A -->
<div style="width:100%" mc:repeatable="CONTENTBLOCK_A">
<p>This is block A</p>
</div>
<!-- end of BLOCK A -->
<!-- BLOCK B -->
<div style="width:100%" mc:repeatable="CONTENTBLOCK_B">
<p>This is block B</p>
</div>
<!-- end of BLOCK B -->
So, when creating a new campaign, if I duplicate BLOCK A and position the duplicated BLOCK A below BLOCK B - in the preview within the campaign editor it looks fine, but when I click to view it into PREVIEW MODE, or send a PREVIEW EMAIL - the duplicated BLOCK A sits above BLOCK B and below its original spawned parent BLOCK A element...
Any ideas? Are the HTML COMMENTS (e.g. < !-- --> ) The issue perhaps?

Answer 1

Very late, but I was able to find success using this:
<table mc:repeatable="content" mc:variant="variant_1">
<tr>
<td mc:edit="section_1">
Variant 1 Content
</td>
</tr>
</table>
<table mc:repeatable="content" mc:variant="variant_2">
<tr>
<td mc:edit="section_2">
Variant 2 Content
</td>
</tr>
</table>
<table mc:repeatable="content" mc:variant="variant_3">
<tr>
<td mc:edit="section_3">
Variant 3 Content
</td>
</tr>
</table>
More in depth explanation can be found here: Create Editable Content Areas with MailChimp’s Template Language