title: How can I align vertically a bar progress inside a td?
body: <p>Hey I have this table : </p>
  
  <p><a href="https://i.stack.imgur.com/D25oS.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/D25oS.jpg" alt="enter image description here"></a></p>
  
  <p>This is part of the code:</p>
  
  <pre><code>$('#grid_proyecto_id').append(
                      '&lt;tr&gt;'+
                          '&lt;td id = "td_project_id" class="text-center"&gt;'+value.nombrePro+'&lt;/td&gt;'+
                          '&lt;td id = "td_project_id" class="text-center"&gt;'+value.numTareasPro+'&lt;/td&gt;'+
                          '&lt;td id = "td_project_id" class="text-center"&gt;'+value.numUsuariosPro+'&lt;/td&gt;'+
                          '&lt;td id = "td_project_id" class="text-center"&gt;'+value.numTerminadasPro+'&lt;/td&gt;'+
                          '&lt;td id = "td_project_id" class="text-center"&gt;'+value.numNoTerminadasPro+'&lt;/td&gt;'+
                          '&lt;td id = "td_bar_id" class="text-center"&gt;&lt;div  class="progress"&gt;&lt;div class="progress-bar progress-bar-success progress-bar-striped" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: '+value.numPorcentajePro+'%;"&gt;'+value.numPorcentajePro+' %&lt;/div&gt;&lt;/div&gt;&lt;/td&gt;'+                    
                      '&lt;/tr&gt;'
                 );    
  </code></pre>
  
  <p>In CSS I use:</p>
  
  <pre><code>#td_project_id{
  
  vertical-align: middle;
  }
  </code></pre>
  
  <p>And works with all the td , except with the last td:</p>
  
  <pre><code>'&lt;td id = "td_bar_id" class="text-center"&gt;&lt;div  class="progress"&gt;&lt;div class="progress-bar progress-bar-success progress-bar-striped" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: '+value.numPorcentajePro+'%;"&gt;'+value.numPorcentajePro+' %&lt;/div&gt;&lt;/div&gt;&lt;/td&gt;'+
  </code></pre>
  
  <p>I'm usign in CSS:</p>
  
  <pre><code>#td_bar_id{
  
  vertical-align: middle;
  }
  </code></pre>
  
  <p>but nothing..</p>
  
  <p>How can I align vertically the last td?? (sorry my english)</p>