Render imported extrenal product image URLs to a limited size under Admin/Product/List

I imported external book cover image URLs into Picture table. I modified PictureService,cs by adding a method to GetPictureExternalUrlById. The display of teh images in product list is fine. However under Admin/Product/List, they are rendered as the original sizes of the URLs, eg. http://cdn.penguin.com.au/covers/original/9780241299807.jpg which is too big to edit other columns,  In this case, the following datatable ColumnProperty Width = "100" seems ineffective.

nopCommerce_4.20_Source\src\Presentation\Nop.Web\Areas\Admin\Views\Product\List.cshtml:
                                new ColumnProperty(nameof(ProductModel.PictureThumbnailUrl))
                                {
                                    Title = T("Admin.Catalog.Products.Fields.PictureThumbnailUrl").Text,
                                    Width = "100",
                                    Render = new RenderPicture()
                                },

How do I change the picture render or set max-width?

Thank you.

I understand that ColumnProperty Width = "100" is only for the width of the column, not the width of the image. How to set CSS or CSS class for the image?

looks like you can assign Datatable columns a classname with javascript after it renders:
https://datatables.net/reference/option/columns.className

once they have a class name then style that class with CSS:

.yourclass {
  width: 100%;
  height: auto;
}

@af1racing Thanks for your suggestion. I've resolved the issue. I have tried to ways. Both are working.
Method 1. use ClassName =  NopColumnClassDefaults.Image with CSS
new ColumnProperty(nameof(ProductModel.PictureThumbnailUrl))
{
  Title = T("Admin.Catalog.Products.Fields.PictureThumbnailUrl").Text,
  ClassName =  NopColumnClassDefaults.Image,
  Width = "100",
  Render = new RenderPicture()
  //Render = new RenderCustom("renderPicturesColumnProductPictureUrl")
},

.image-column {
  width: 100px;
}

.table > tbody > tr > td.image-column {
  width: 100px;
}

  .table > tbody > tr > td.image-column img {
    width: 100px;
  }

Since the img element tag has been styled with the width, no further CSS ClassName is required with RenderPicture class.

Method 2. use RenderCustom class and function "renderPicturesColumnProductPictureUrl"
<script>
  function renderPicturesColumnProductPictureUrl(data, type, row, meta) {
    return '<a href="' + row.PictureThumbnailUrl + '" target="_blank"><img alt="' + row.PictureId + '" src="' + row.PictureThumbnailUrl + '" width="100" /></a>';
  }
</script>

new ColumnProperty(nameof(ProductModel.PictureThumbnailUrl))
{
  Title = T("Admin.Catalog.Products.Fields.PictureThumbnailUrl").Text,
  //ClassName =  NopColumnClassDefaults.Image,
  Width = "100",
  //Render = new RenderPicture()
  Render = new RenderCustom("renderPicturesColumnProductPictureUrl")
},