Magento – Magento 2: Set Grid column width

gridmagento-2.1uicomponent

I added new thumbnail grid in UI grid.

<column name="mimage" class="Vendor\Slider\Ui\Component\Listing\Column\MobileImage">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="component" xsi:type="string">Magento_Ui/js/grid/columns/thumbnail</item>
            <item name="sortable" xsi:type="boolean">false</item>
            <item name="altField" xsi:type="string">name</item>
            <item name="has_preview" xsi:type="string">1</item>
            <item name="label" xsi:type="string" translate="true">Mobile Image</item>
        </item>
    </argument>
</column>

Then I try folowing argumnets but it's not work

<item name="resizeEnabled" xsi:type="boolean">true</item>
<item name="resizeDefaultWidth" xsi:type="string">60</item>

Also try

<argument name="width" xsi:type="string">150px</argument>

But it displays default width.

Any help appreciated.

Best Answer

Resize can be switched on for any listing column like this:

<column name="creation_time">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="resizeEnabled" xsi:type="boolean">true</item>
            <item name="resizeDefaultWidth" xsi:type="string">60</item>
        </item>
    </argument>
</column>

If above not working use below best way.

Update width parameter from CSS or .less file of adminhtml theme 

.data-grid .data-grid-thumbnail-cell img {
    border: 1px solid #d6d6d6;
    width: /*change per your wish*/;
}
Related Topic