这应该这样做：

  

    

      

        
Rating Scale: 
        

          

            

              
{{ rating.ratingName }}
              
{{ rating.ratingName }}
            
          
        
      
    
  

#pdfTable .ratings {
  columns: 2;
  td:first-child {
    vertical-align: top;
  }
  & > div {
    font-weight: bold;
    break-inside: avoid;
    display: flex;
    & > div:first-child {
      flex: 0 0 2rem;
      text-align: right;
      padding-right: 0.5rem;
    }
    & > div:last-child {
      flex-grow: 1;
    }
  }
}

根据您的项目，您可能需要在边距/填充方面稍微调整 CSS。

说明：您当前的标记为每个评级创建一个新的 <tr> （表格行）。但是您的设计表明您需要两个单元格：

• 一个与 “评分量表：”
• 一个有实际收视率。

在第二列中，我使用了 CSS columns 布局，有两列。
剩下的就是细节了。