Make table width fixed with Bootstrap table-condensed class
<p><a href="https://stackoverflow.com/questions/38028870/making-toggling-element-containing-table-stop-changing-column-widths">Once I've solved this question</a>, but now I am facing the problem that if I remove the table table-condensed classes, everything works fine. But I do really need the job that these classes do, and want to achieve fixed first column width WITHOUT removing table table-condensed. </p>

<pre><code>&lt;table class="table zeon zeon-row-hover table-condensed zeon-draggable zeon-with-edit-pencil"&gt;
  &lt;thead&gt;
    &lt;th class='fixed-narrow-column'&gt;&lt;/th&gt;
    &lt;th&gt;&lt;/th&gt;
  &lt;/thead&gt;
  &lt;tbody&gt;
    &lt;!-- If there are any initiated tasks at all --&gt;
    &lt;tr&gt;
      &lt;td class='zeon-edit-pencil-column-pop-up fixed-narrow-column'&gt;
        &lt;span class='glyphicon glyphicon-pencil zeon-edit-pencil'&gt;&lt;/span&gt;
      &lt;/td&gt;
      &lt;td class='fixed-narrow-column'&gt;A&lt;/td&gt;

    &lt;/tr&gt;
    &lt;tr&gt;
      &lt;td class='zeon-edit-pencil-column-pop-up fixed-narrow-column'&gt;
        &lt;span class='glyphicon glyphicon-pencil zeon-edit-pencil'&gt;&lt;/span&gt;
      &lt;/td&gt;
      &lt;td class='fixed-narrow-column'&gt;A&lt;/td&gt;
    &lt;/tr&gt;
  &lt;/tbody&gt;
&lt;/table&gt;
</code></pre>

<p>AND I WANT THE 1st COLUMN TO BE NARROW !!!!
I expect that table table-condensed make the table stretch out by the entire space
<a href="https://jsfiddle.net/1Lmmwxzo/" rel="nofollow noreferrer">JSFiddle</a></p>