php Yii2 GridView 无法设置列宽
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/30976065/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Yii2 GridView cannot set column width
提问by user2997695
this is the first time I am using the Yii2 GridView Widget. I have tried setting a column's width after reading some answers here on stackoverflow, but it just won't work for me and I would love it if the columns had different widths (especially the first one).
这是我第一次使用 Yii2 GridView Widget。在stackoverflow上阅读了一些答案后，我尝试设置列的宽度，但它对我不起作用，如果列的宽度不同（尤其是第一个），我会喜欢它。
I have tried setting the width using 'contentOptions' directly for the first column and also with an external CSS file for the product name column.
我尝试直接使用“contentOptions”为第一列设置宽度，并为产品名称列使用外部 CSS 文件。
Can someone please tell me if there is an alternative or if there is something I am doing wrong?
有人可以告诉我是否有其他选择，或者我做错了什么？
<?= GridView::widget([
'dataProvider' => $dataProvider,
'filterModel' => $searchModel,
'columns' => [
[
'class' => 'yii\grid\SerialColumn',
'contentOptions' => ['style' => 'max-width:20px;'],
],
[
'format' => 'raw',
'label' => 'Image',
'value' => function ($data) {
$url = $data->imgSrc;
return Html::img($url, ['width' => '40px']);
},
],
[
'attribute' => 'name',
'format' => 'raw',
'label' => 'Product name',
'contentOptions' => function ($model, $key, $index, $column) {
return ['class' => 'tbl_name'];
},
],
],
]); ?>
回答by sambua
If you want set width for single column you can use headerOptions:
如果要为单列设置宽度，可以使用 headerOptions：
[
'attribute' => 'attribute_name',
'headerOptions' => ['style' => 'width:20%'],
],
回答by freesh
you have to set it like this:
你必须这样设置：
<?= GridView::widget([
'dataProvider' => $dataProvider,
'filterModel' => $searchModel,
'columns' => [
[
'attribute'=>'title',
'contentOptions' => ['style' => 'width:200px; white-space: normal;'],
],
]
]
);
?>
With contentOptions you can set options to all td for the column "title". In Site.css is white-space set to nowrap by default.
使用 contentOptions，您可以为列“标题”的所有 td 设置选项。Site.css 中的空白默认设置为 nowrap。
.grid-view td {
white-space: nowrap;
}
But if your content is longer than 200px for example, the col will be expand by content and ignores your with.
但是，例如，如果您的内容长于 200 像素，则 col 将按内容展开并忽略您的 with。
回答by Saeed
First add Option like
首先添加选项，如
GridView::widget([
'dataProvider' => $dataProvider,
'filterModel' => $searchModel,
'options' => [ 'style' => 'table-layout:fixed;' ],
after that add below lines
之后添加以下行
[
'attribute' => 'news_description',
'contentOptions' => [ 'style' => 'width: 25%;' ],
],
回答by Rostyslav Pylypenko
This could be the result of white-spacecss property, that will affect the table cell width depending on content in it. In my Yii2 project I had:
这可能是空白css 属性的结果，这将根据其中的内容影响表格单元格的宽度。在我的 Yii2 项目中，我有：
.grid-view td {
white-space: nowrap;
}
No one from advices provided here was not usefull for me. But this was usefull:
这里提供的建议中没有人对我没有用。但这很有用：
.grid-view td {
white-space:pre-line; // or just 'normal'
}
回答by robsch
It depends on what you trying to achieve. But max-widthwith 20 pixels is probably not what you actually wanted. Try it with width:
这取决于你想要达到的目标。但是max-width20 像素可能不是您真正想要的。试试看width：
[
'class' => 'yii\grid\SerialColumn',
'contentOptions' => ['style' => 'width:100px;'], // not max-width
],
回答by Rev
The only solution that has entirely solved the problem was the one suggested by https://stackoverflow.com/users/2053862/rostyslav-pylypenko: Here is the trick:
完全解决问题的唯一解决方案是https://stackoverflow.com/users/2053862/rostyslav-pylypenko建议的解决方案：这是诀窍：
td {
white-space:normal !important;
}
回答by Paulo Rodrigo Martins
I simple but functional solution is to create a CSS setting a max-width for the columns. The !importantflag is to ensure that this property doesn't get overrriden.
我简单但实用的解决方案是创建一个 CSS 设置列的最大宽度。该!important标志是为了确保此属性不会被覆盖。
td {
max-width: 800px;
white-space: normal !important;
}
Then, you just register it in your view.
然后，您只需在您的视图中注册它。
$this->registerCssFile('css/tableColumnMaxWidht.css');
We have and example of this table working in this image here.
我们已经和例子此表在此图像中的工作在这里。
回答by Chinmay
Try with just Options:
仅尝试Options：
[
'class' => 'yii\grid\SerialColumn',
'options' => ['style' => 'max-width:20px;'],
],
