如何阻止行跨覆盖行大小？

Question

我正在尝试从表中创建行的网格。我正在使用rowspan来使行水平显示，并且它在一定程度上起作用，除了id喜欢调整顶部和底部行的大小。不知道是什么导致了这个ive尝试了很多不同的事情来像height的值，以及max-height这样的东西，但是不管它是多么奇怪地调整行的大小。

这是我桌子的照片：

这是我的HTML代码：

<table id="Table" class="JobID-table" style="text-align:center">
                <tr class="jobID-Table-tr" ng-repeat="p in puller | orderBy : '-modName'" >             
                    <td rowspan="19" ng-click="sendJobId(p.modName)" class={{p.cellClass}} >
                        {{p.modName}}   
                     </td>
                     <td  rowspan="19" ng-click="sendJobId(p.modName)" class={{p.cellClass}} >              
                        {{p.modCount}}
                     </td>
                </tr>
            </table> 

这是我的CSS：

@-webkit-keyframes blinker {
  from {opacity: 1.0;}
  to {opacity: 0.0;}
}
.JobID-table {
    border: 1px;
    border-collapse: collapse;
    table-layout: fixed;


}
.JobID-table-tr {
    border: 1px solid #24396a;
    border-collapse: collapse;

}
.JobID-table-td {
    border: 1px 
    border-collapse: collapse;
    font-family: Arial;
    font-size: 20px;
    cursor: pointer;
    padding: 20px;

}
.JobID-table-tr:hover {
color: grey;
background-color: #24396a;

}
.table-Header {
    background: linear-gradient(to bottom, #0033cc 12%, #0099ff 99%);
    border: 0px 
    border-collapse: collapse;
    font-family: Arial;
    font-size: 15px;
    font-weight: bold;
    font-color: white;
    cursor: pointer;    
    width: 150px;
    max-width:150px;
    height: 30px;
}
.under-one-mil {
    background: linear-gradient(to bottom, #0033cc 12%, #0099ff 99%);
    border: 0px 
    border-collapse: collapse;
    font-family: Arial;
    font-size: 15px;
    font-weight: bold;
    font-color: white;
    cursor: pointer;
    width: 150px;
    max-width:150px;
    height: 30px;
}
.under-three-mil {
    background: linear-gradient(to bottom, #0066cc 12%, #33ccff 99%);
    border: 0px 
    border-collapse: collapse;
    font-family: Arial;
    font-size: 15px;
    font-weight: bold;
    cursor: pointer;
    width: 150px;
    max-width:150px;
    height: 30px;
}
.under-five-mil {
    background: linear-gradient(to bottom, #0099ff 12%, #66ffff 99%);
    border: 0px 
    border-collapse: collapse;
    font-family: Arial;
    font-size: 15px;
    font-weight: bold;
    cursor: pointer;
    width: 150px;
    max-width:150px;
    height: 30px;
}
.under-twenty-mil {
    background: linear-gradient(to bottom, #33ccff 12%, #ccffff 99%);
    border: 0px 
    border-collapse: collapse;
    font-family: Arial;
    font-size: 15px;
    font-weight: bold;
    cursor: pointer;
    width: 150px;
    max-width:150px;
    height: 30px;
}
.under-fourty-mil {
    background: linear-gradient(to bottom, #ccffff 1%, #ffffcc 112%);
    border: 0px 
    border-collapse: collapse;
    font-family: Arial;
    font-size: 15px;
    font-weight: bold;
    cursor: pointer;
    width: 150px;
    max-width:150px;
    height: 30px;
}
.under-seventy-mil {
    background: linear-gradient(to bottom, #ffffcc 1%, #ffffff 112%);
    border: 0px 
    border-collapse: collapse;
    font-family: Arial;
    font-size: 15px;
    font-weight: bold;
    cursor: pointer;
    width: 150px;
    max-width:150px;
    height: 30px;
}
.under-sixhundred-mil {
    background: linear-gradient(to bottom, #ff9966 1%, #ffcc99 112%);
    border: 0px 
    border-collapse: collapse;
    font-family: Arial;
    font-size: 15px;
    font-weight: bold;
    cursor: pointer;
    width: 150px;
    max-width:150px;
    height: 30px;
}
.under-tenthoustand-mil {
    background: linear-gradient(to bottom, #ff6600 1%, #ffcc66 112%);
    border: 0px 
    border-collapse: collapse;
    font-family: Arial;
    font-size: 15px;
    font-weight: bold;
    cursor: pointer;
    width: 150px;
    max-width:150px;
    height: 30px;
}
.under-fiftythousand-mil {
    background: linear-gradient(to bottom, #ff3300 1%, #ff9966 112%);
    border: 0px 
    border-collapse: collapse;
    font-family: Arial;
    font-size: 15px;
    font-weight: bold;
    cursor: pointer;
    text-decoration: blink;
    -webkit-animation-name: blinker;
    -webkit-animation-duration: 0.6s;
    -webkit-animation-iteration-count:infinite;
    -webkit-animation-timing-function:ease-in-out;
    -webkit-animation-direction: alternate;
    width: 150px;
    max-width:150px;
    height: 30px;
}