如何禁用水平滾動並縮小移動視圖上元素的大小？

我正在使用Material-ui用於我的項目。現在我有很多錨元素在mui的Paper組件中顯示爲一張表格。由於這個表格非常長，它會在移動視圖中生成一個水平滾動條，這不是我想要的。我想知道是否有一種方法可以縮小所有表格式錨點元素的寬度，以便水平滾動條不會出現？（我不想用overflow-x: hidden隱藏元素）如何禁用水平滾動並縮小移動視圖上元素的大小？

我的代碼的簡化版本：

class Row extends React.Component { 
    render() { 
    const cell = (<a class="linkCell" key={cell.id} href="#"></a>); 
     const row = []; 
    for (let i = 0; i < 20; i++) { 
     row.push(cell); 
    } 
    return <div>{Row}</div> 
    } 
} 

class WholeTable extends React.Component { 
    render() { 
    const row = <Row key={row.id}/> 
    const table = []; 
    for (let i = 0; i < 100; i++) { 
    table.push(row); 
    } 
    return <Paper>{table}</Paper> 
    }; 
}

它看起來像現在什麼（之前和水平滾動之後）：