Yii2 GridView cannot set column width

Question

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).

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.

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'];
            },
        ],
    ],
]); ?>

Answer 1

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%;' ],
],