如何禁用水平滚动并缩小移动视图上元素的大小？

我正在使用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> 
    }; 
}

它看起来像现在什么（之前和水平滚动之后）：