Hi,

I have the following HTML code that I import as a survey to my project.

After some JS customization in the answer table, it works as expected.

However, if I set the new survey experience the same code becomes problematic. It seems that a ghost column is inserted at the right side of the table, and I cannot fix it. Is it possible to have a solution for this issue?

cheers

Luis

Imagine that these two platforms would be launched in the near future.</p>

<p>You are considering to try out one of them.</p>

<p>Which one would you choose?</br><br/>

<style type="text/css">table {
width: 100%;
border: none;
border-collapse: collapse;}
th = {
text-align:left;
}
th, td {
font-family: verdana;
font-size: 12px;
padding: 3px;}
th = {
text-align:left;
}
td:first-child {
border-left:none;
border-top:none;
}
td {
line-height:1.2;
border-left:2px solid #FFFFFF;
border-right:2px solid #FFFFFF;
border-bottom:1px solid #FFFFFF;
}
td.att {
width:30%;
}
td.alt {
width:35%;
}
p {
margin-bottom:2.5%;
text-align:left;
}
</style>
<table>
<tbody>
<tr>
<td class="att" height="50"> </td>
<td class="alt" bgcolor="#DCDCDC"><div style="font-family:verdana;font-size:12px;font-weight:bold;text-align: center;">Platform 1</div>
<td class="alt" bgcolor="#F2F0F0"><div style="font-family:verdana;font-size:12px;font-weight:bold;text-align: center;">Platform 2</div>
</tr>
<tr>
<td class="atr" height="40">
<p><strong>Your average net earnings per hour</strong></p>
</td>
<td bgcolor="#DCDCDC"><div style="font-family:verdana;font-size:12px;text-align: center;">&#163;10</div></td>
<td bgcolor="#F2F0F0"><div style="font-family:verdana;font-size:12px;text-align: center;">&#163;6</div></td>
</tr>
<tr>
<td class="atr" height="100">
<p><strong>The composition of your total payment</strong></p>
</td>
<td bgcolor="#DCDCDC"><p>&bull; You are paid per completed task<p>&bull; The platform guarantees minimum<br>&nbsp;&nbsp;earnings of &#163;6 per hour worked</p><p>&bull; The counting of hours begins when you<br>&nbsp;&nbsp;log in and ends when you log out</p><p>&bull; AI will check whether you are actively<br>&nbsp;&nbsp;working while logged in</td>
<td bgcolor="#F2F0F0"><p>&bull; You are paid per completed task<br>&nbsp;&nbsp;No guarantee of minimum payment</p></td>
</tr>
<tr>
<td class="atr" height="70">
<p><strong>Decision about task prices</strong></p>
</td>
<td bgcolor="#DCDCDC"><p>&bull; The buyer suggests a price</p><p>&bull; You can offer prices up to<br>&nbsp;&nbsp;20% higher or lower</p><p>&bull; The buyer chooses the taskers</p></td>
<td bgcolor="#F2F0F0"><p>&bull; The buyer sets the price</p></td>
</tr>
<tr>
<td class="atr" height="70">
<p><strong>How much freedom you have to choose your working hours</strong></p>
</td>
<td bgcolor="#DCDCDC"><p>&bull; The platform publishes available time slots</p><p>&bull; You are free to login to work in any of<br>&nbsp;&nbsp;these slot when there is demand</p></td>
<td bgcolor="#F2F0F0"><p>&bull; The platform publishes available time slots</p><p>&bull; The platform in a given week assigns you<br>&nbsp;&nbsp;to time slots depending on demand</td>
</tr>
<tr>
<td class="atr" height="70">
<p><strong>Choice between types of tasks you can do</strong></p><p>&bull; Explore human behaviour</p><p>&bull; Improve AI</p><p>&bull; Marketing research<br>&nbsp;&nbsp;Influence new products and brands</p>
</td>
<td bgcolor="#DCDCDC"><p>&bull; The platform offers three types of task</p><p>&bull; You choose what you want to do</p></td>
<td bgcolor="#F2F0F0"><p>&bull; The platform assigns tasks as needed</p></td>
</tr>
</tbody>
</table>