ZOHO CREATOR RECORD TEMPLATE ALIGNEMENT BETWEEN FIELD NAME AND VALUES.

ZOHO CREATOR RECORD TEMPLATE ALIGNEMENT BETWEEN FIELD NAME AND VALUES.

Hi Good Day every , can somebody help me to figure out this?

I created a HTML table using HTML and deluge. And add a rich text field to the form to contain all the values and push to the Zoho Creator record template. Now I got a problem with the alignment between values and field names. See the screenshot below.



As you can see the colon is not align properly, can anyone help me to figure out this one ?

here is my script

// HIDE_SHOW_FIELDS_IN_TEMPLATE_FOR_TECHNICAL_DATA =========================================================
acc_table = "";
html_table = "";
if(input.Max_Load_Capacity != null && input.Max_Load_Capacity != 0)
{
acc_table = acc_table + "<tr><td style=\"width: 50%; text-align: left; font-size: 12px; background-color: rgba(0, 0, 0, 0);&#09;\">Max Load Capacity (Kg)  :   " + input.Max_Load_Capacity + "</td>";
acc_table = acc_table + "<td style=\"width: 13%; text-align: left;\"></td>";
}
if(input.Minimum_Height != null && input.Minimum_Height != 0)
{
acc_table = acc_table + "<tr><td style=\"width: 50%; text-align: left;font-size: 12px; background-color: rgba(0, 0, 0, 0)\">Minimum Height  (mm)  :    " + input.Minimum_Height + "</td>";
acc_table = acc_table + "<td style=\"width: 13%; text-align: left;\"></td>";
}
if(input.Max_Height != null && input.Max_Height != 0)
{
acc_table = acc_table + "<tr><td style=\"width: 50%; text-align: left;font-size: 12px; background-color: rgba(0, 0, 0, 0)\">Maximum Height  (mm)      : " + input.Max_Height + "</td>";
acc_table = acc_table + "<td style=\"width: 13%; text-align: left;\"></td>";
}
if(input.Demag_Bridge != null && input.Demag_Bridge != 0)
{
acc_table = acc_table + "<tr><td style=\"width: 50%; text-align: left;font-size: 12px; background-color: rgba(0, 0, 0, 0)\">Demag Bridge     : " + input.Demag_Bridge + "</td>";
acc_table = acc_table + "<td style=\"width: 13%; text-align: left;\"></td>";
}
// if(input.Cycle_Time_Duration != null && input.Cycle_Time_Duration != 0)
// {
// acc_table = acc_table + "<tr><td style=\"width: 50%; text-align: left; background-color: rgba(0, 0, 0, 0)\">Cycle Time Duration " + input.Cycle_Time_Duration + "</td>";
// acc_table = acc_table + "<td style=\"width: 13%; text-align: left;\"></td>";
// }
html_table = html_table + "<table class=\"fs\" style=\"margin: 1px auto; font-size: 12px; width: 100%; border: 0px\" cellspacing=\"0\"> <tbody>";
html_table = html_table + acc_table;
html_table = html_table + "</tbody></table>";
input.HIDE_SHOW_FIELDS_IN_TEMPLATE_FOR_TECHNICAL_DATA = html_table;
// =======================================================================================================================================================================================================================================================================================================================================================================HIDE_SHOW_FIELDS_IN_TEMPLATE_FOR_TECHNICAL_DATA2===========================================
acc_table2 = "";
html_table2 = "";
if(input.Max_Radius != null && input.Max_Radius != 0)
{
acc_table2 = acc_table2 + "<tr><td style=\"width: 50%; text-align: left; font-size: 12px; background-color: rgba(0, 0, 0, 0)\">Working Radius (mm) :     " + input.Max_Radius + "</td>";
acc_table2 = acc_table2 + "<td style=\"width: 13%; text-align: left;\"></td>";
}
if(input.Demag_Runway != null && input.Demag_Runway != 0)
{
acc_table2 = acc_table2 + "<tr><td style=\"width: 50%; text-align: left; font-size: 12px; background-color: rgba(0, 0, 0, 0)\">Demag Runway :     " + input.Demag_Runway + "</td>";
acc_table2 = acc_table2 + "<td style=\"width: 13%; text-align: left;\"></td>";
}
if(input.Air_Supply_Pressure != null && input.Air_Supply_Pressure != 0)
{
acc_table2 = acc_table2 + "<tr><td style=\"width: 50%; text-align: left; font-size: 12px; background-color: rgba(0, 0, 0, 0)\">Air Supply Pressure :    " + input.Air_Supply_Pressure + "</td>";
acc_table2 = acc_table2 + "<td style=\"width: 13%; text-align: left;\"></td>";
}
acc_table2 = acc_table2 + "<tr><td style=\"width: 50%; text-align: left; font-size: 12px; background-color: rgba(0, 0, 0, 0)\">Compressed Air Supply  " + ": Clean, Dry, Oil free air" + "</td>";
acc_table2 = acc_table2 + "<td style=\"width: 13%; text-align: left;\"></td>";
//
html_table2 = html_table2 + "<table class=\"fs\" style=\"margin: 1px auto; width: 100%; border: 0px\" cellspacing=\"0\"> <tbody>";
html_table2 = html_table2 + acc_table2;
html_table2 = html_table2 + "</tbody></table>";
input.HIDE_SHOW_FIELDS_IN_TEMPLATE_FOR_TECHNICAL_DATA2 = html_table2;
//================================================================================================================================================================================================================================= END===============================================================================================================================

I contained all the values in rich text fields and map to record template inside the table.

Thank you