控制 MatTable 列的宽度答案

【问题标题】：Controlling width of MatTable Column控制 MatTable 列的宽度
【发布时间】：2021-01-15 23:55:43
【问题描述】：

如何控制 MatBlazor MatTable 中列的宽度

我已经摆弄了一下，通过在浏览器“检查器”中禁用 css 类 mdc-table...似乎可以获得“正常”表行为。

现在除了最后一列之外的所有列都很窄，（实际宽度：119、153、460）最后一列只有两个图标，所以宽度应该是 100px 左右，中间一列是一个很长的文本字符串，所以我希望它更宽。

代码没有太多戏剧性，但无论如何......

<MatDialog @bind-IsOpen="@ShowBeginCreateNewSLA">
    <MatDialogTitle>Service level agremeents</MatDialogTitle>
    <MatDialogContent>
        <MatTable ShowPaging="false" Items="SLAOptions">
            <MatTableHeader>
                <th>Id</th>
                <th>Description</th>
                <th>Action</th>
            </MatTableHeader>
            <MatTableRow>
                <td>@context.Id</td>
                <td>@context.Description</td>
                <td><MatIconButton Icon="delete"  /></td>
            </MatTableRow>
        </MatTable>
    </MatDialogContent>
    <MatDialogActions>
        <MatButton>Close</MatButton>
    </MatDialogActions>
</MatDialog>

知道我能做什么吗？

【问题讨论】：

标签： matblazor

【解决方案1】：

我发现设置的方式，在文档中也有提到，就是简单的在表头插入一个带有fixed with的div，比如

<th><div style="width: 200px">Options</div></th>

【讨论】：