title: What do I need to change in order to put icon syde-by-side
body: <p>I spend hours and hours to see what I made wrong but whatever I try nothing happened. So the problem is following.
  I have two action in my Index page and I put icon (font-awesome libary) to represent Edit and Delete.
  And I want to put icon side-by-side, right now there are separate in another row</p>
  <p><a href="https://i.stack.imgur.com/0rPJi.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/0rPJi.png" alt="enter image description here" /></a></p>
  <p>What I try so far is to make datatabe smaller but however this doesn't help me.</p>
  <pre><code>&lt;div class=&quot;panel panel-flat&quot;&gt;
      &lt;div class=&quot;panel-body&quot;&gt;
          &lt;table class=&quot;table datatable-responsive datatable-patients&quot;&gt;
              &lt;thead&gt;
                  &lt;tr class=&quot;bg-blue&quot;&gt;
                      &lt;th&gt;
                          Firstname
                      &lt;/th&gt;
                      &lt;th&gt;
                          Lastname
                      &lt;/th&gt;
                      &lt;th&gt;
                          Contact
                      &lt;/th&gt;
                      &lt;th&gt;
                          Email
                      &lt;/th&gt;
                      &lt;th&gt;
                          Blood Group
                      &lt;/th&gt;
                      &lt;th&gt;&lt;/th&gt;     
                  &lt;/tr&gt;
              &lt;/thead&gt;
              &lt;tbody&gt;
                  @foreach (var item in Model)
                  {
                      &lt;tr id=&quot;tr-id-@item.patient_id&quot;&gt;
                          &lt;td&gt;
                              @Html.DisplayFor(modelItem =&gt; item.patient_first_name)
                          &lt;/td&gt;
  
                          &lt;td&gt;
                              @Html.DisplayFor(modelItem =&gt; item.patient_last_name)
                          &lt;/td&gt;
  
                          &lt;td&gt;
                              @Html.DisplayFor(modelItem =&gt; item.patient_contact_number)
                          &lt;/td&gt;
  
                          &lt;td&gt;
                              @Html.DisplayFor(modelItem =&gt; item.patient_email)
                          &lt;/td&gt;
  
                          &lt;td&gt;
                              @Html.DisplayFor(modelItem =&gt; item.patient_blood_group)
                          &lt;/td&gt;
  
                          &lt;td&gt;
                              &lt;ul class=&quot;icons-list text-left&quot;&gt;
                                  &lt;li class=&quot;text-primary-600&quot;&gt;&lt;a href=&quot;~/Patients/Edit?Id=@item.patient_id&quot;&gt;&lt;i class=&quot;icon-pencil7&quot;&gt;&lt;/i&gt;&lt;/a&gt;&lt;/li&gt;
                                  &lt;li class=&quot;text-danger-600&quot;&gt;&lt;a class=&quot;delete_pacient&quot; href=&quot;javascript:;&quot; data-id=&quot;@item.patient_id&quot;&gt;&lt;i class=&quot;icon-trash&quot;&gt;&lt;/i&gt;&lt;/a&gt;&lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/td&gt;
  
                      &lt;/tr&gt;
                   }
              &lt;/tbody&gt;
          &lt;/table&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  
  
  
   $('.datatable-patients').DataTable({
          dom: 'Bfrtip',
  
          columnDefs: [
              {
                  responsivePriority: 1,
                  targets: -1
              },
              {
                  targets: [-1],
                  orderable: false,
                  searchable: false,
                  printable: false,
                  width: &quot;120&quot;
              }
          ]
      });
  </code></pre>
  <p>I try to add  in separate  but doesn't work as well.
  Can anyone tell me what is wrong here ? WHere did I made mistake ?</p>