title: split html table tr horizontally in to two
body: <p>i have table with 2 columns and in 2nd column I have nested table. I want to split tr in two horizontally block... in first i put all the tds and in 2nd I put confirm and cancel buttons</p>
  
  <p><img src="https://i.stack.imgur.com/4Yf54.png" alt="enter image description here"></p>
  
  <pre><code>  &lt;table id="ElementTable" class="customTable_01"&gt;
                   &lt;thead&gt;
                          &lt;tr&gt;
                              &lt;th class="SC_a1"&gt;
                                  @Html.DisplayName("Element")
                              &lt;/th&gt;
  
                              &lt;th class="SC_a2"&gt;
                                  Marking-Scheme
                              &lt;/th&gt;
                          &lt;/tr&gt;
                   &lt;/thead&gt;
                  &lt;tbody&gt;
                      @foreach (var item in Model._Element)
                          {
                          &lt;tr&gt;
                              &lt;td class="SC_a1"&gt; @Html.DisplayFor(modelitem =&gt; item.ElementTitle) &lt;/td&gt;
  
                              &lt;td class="SC_a2"&gt;
                                  &lt;input type="button" value="Add" name="button" data-id="@item.ElementID" class="k-button k-button-icontext k-grid-Add ComponentScheme_Add" /&gt;
  
                                  @*Nasted Table....*@
                                  &lt;table class="NastedElementTable"&gt;
                                      &lt;thead&gt;
                                          &lt;tr&gt;
                                              &lt;th class="N_th"&gt;Mark Scheme Title&lt;/th&gt;
                                              &lt;th class="N_th"&gt;Available-Mark&lt;/th&gt;
                                              &lt;th class="N_th"&gt;Pass-Mark&lt;/th&gt;
                                              &lt;th class="N_th"&gt;Merit-Mark&lt;/th&gt;
                                              &lt;th class="N_th"&gt;Distinction-Mark&lt;/th&gt;
                                          &lt;/tr&gt;
                                      &lt;/thead&gt;
                                      &lt;tbody&gt;
                                          &lt;tr&gt;
                                              &lt;td class="N_td"&gt;@Html.TextBox("Input_Title_Element", null, new { id = @item.ElementID + "_DM", @class = "ElementDistinctionMark k-grid-input k-textbox_3" })  &lt;/td&gt;
                                              &lt;td class="N_td"&gt;@Html.TextBox("Input_AvailableMark_Element", null, new { id = @item.ElementID + "_AM", @class = "ElementAvailableMarks k-grid-input k-textbox_4" })&lt;/td&gt;
                                              &lt;td class="N_td"&gt;@Html.TextBox("Input_PassMark_Element", null, new { id = @item.ElementID + "_PM", @class = "ElementPassMark k-grid-input k-textbox_4" })&lt;/td&gt;
                                              &lt;td class="N_td"&gt;@Html.TextBox("Input_MeritMark_Element", null, new { id = @item.ElementID + "_MM", @class = "ElementMeritMark k-grid-input k-textbox_4" })&lt;/td&gt;
                                              &lt;td rowspan="2" class="N_td"&gt;@Html.TextBox("Input_DistinctionMark_Element", null, new { id = @item.ElementID + "_DM", @class = "ElementDistinctionMark k-grid-input k-textbox_4" })&lt;/td&gt;
  
  
  
                                          &lt;/tr&gt;
  
  
  
                                      &lt;/tbody&gt;
                                  &lt;/table&gt;
  
                              &lt;/td&gt;
                          &lt;/tr&gt;
                         }
                  &lt;/tbody&gt;
                &lt;/table&gt;
  </code></pre>