Javascript 如何在td内垂直对齐进度条？

嘿，我有这张桌子：

这是代码的一部分：

$('#grid_proyecto_id').append(
                    '<tr>'+
                        '<td id = "td_project_id" class="text-center">'+value.nombrePro+'</td>'+
                        '<td id = "td_project_id" class="text-center">'+value.numTareasPro+'</td>'+
                        '<td id = "td_project_id" class="text-center">'+value.numUsuariosPro+'</td>'+
                        '<td id = "td_project_id" class="text-center">'+value.numTerminadasPro+'</td>'+
                        '<td id = "td_project_id" class="text-center">'+value.numNoTerminadasPro+'</td>'+
                        '<td id = "td_bar_id" class="text-center"><div  class="progress"><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+'%;">'+value.numPorcentajePro+' %</div></div></td>'+                    
                    '</tr>'
               );    

并与所有td一起工作，但最后一个td除外：

'<td id = "td_bar_id" class="text-center"><div  class="progress"><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+'%;">'+value.numPorcentajePro+' %</div></div></td>'+

但是什么也没有

如何垂直对齐最后一个td？？对不起，我的英语

，因为Bootstrap添加了一个边距底部：20px；进度类，您只需将其添加到CSS中，使其正确垂直对齐：中间；表格单元格内部：

.table > tbody > tr > td {
    vertical-align: middle !important;
}
.table > tbody > tr > td > .progress {
    margin-bottom: 0px !important;
}

---

是一款适合您需要的简洁工具。我认为你的进程外部div和block-level元素有问题。所有行的高度都一样吗？也许只需更改css中的top或margin top值即可。即使它们都是相同的高度，从分隔线的均匀长度看起来好像比每列垂直于中间的东西看起来更好。或者margintop，我想要一种类型的类或其他东西：我有一个jsfiddle试图重现您的问题，但它没有出现在我的jsfiddle中。你能为你的进度条提供一些css吗？@Jeanbf你不能做一些像grid_proyecto_id tr>td.text-center{margin top:20px}这样的事情吗？我不知道你想上什么课。可能是翻译的东西。

#td_bar_id{

vertical-align: middle;
}

.table > tbody > tr > td {
    vertical-align: middle !important;
}
.table > tbody > tr > td > .progress {
    margin-bottom: 0px !important;
}