【问题标题】:What is the reason for padding-right 40px in Material-UI TableCell-rootMaterial-UI TableCell-root中padding-right 40px是什么原因
【发布时间】:2019-11-21 06:59:54
【问题描述】:

我只是好奇这是什么原因。我打算覆盖它, 只是想确保我不会消除某人的彻底工作。

.MuiTableCell-root {
    display: table-cell;
    padding: 14px 40px 14px 16px;
    font-size: 0.875rem;
    text-align: left;
    font-family: "Roboto", "Helvetica", "Arial", sans-serif;
    font-weight: 400;
    line-height: 1.43;
    border-bottom: 1px solid rgba(224, 224, 224, 1);
    letter-spacing: 0.01071em;
    vertical-align: inherit;

有什么好玩的

.MuiTableCell-root:last-child {
    padding-right: 16px;
}

【问题讨论】:

  • 因为他们认为应该是这样的。
  • @josemartindev 好吧,我知道我可以做到,我只是想它可能是保持一致布局的东西,如果没有它,布局会在某些屏幕尺寸或其他角落情况下中断。

标签: javascript css reactjs material-design material-ui


【解决方案1】:

这是当前规范:https://material.io/design/components/data-tables.html#specs

我没有在规范中看到任何明确提及此 40 像素填充的内容,尽管该示例确实显示了列之间的相当大的空间。

我认为目的只是为了在相邻单元格中的数据之间留出美观的空间并提高可读性。如果在桌子上使用size="small",则填充量会显着减少(padding-right 为 24px)。

【讨论】:

    猜你喜欢
    • 2012-09-15
    • 2015-01-26
    • 2015-06-01
    • 1970-01-01
    • 2014-09-06
    • 2014-02-05
    • 2021-08-19
    • 2017-04-10
    • 2017-02-05
    相关资源
    最近更新 更多