List view formatting with JSON - limit the container height

Question

When I apply view formatting to a doc library view, a height gets applied to the container which leaves a huge white space. This is the html where it gets applied:

<div class="e_b_ea5ab61a" data-automation-id="detailsListContainer" data-is-scrollable="true" style="height: 640px;">

And here's the first part of the JSON:

{
"schema": "https://developer.microsoft.com/json-schemas/sp/view-formatting.schema.json",
"hideColumnHeader": "true",
"hideSelection": true,
"tileProps": {
"hideSelection": true,
"width": "130",
"height": "110",
"formatter": {
  "elmType": "div",
  "style":{
      "max-height":"120px"

  },
  "children": [
    {
      "elmType": "div",
      "attributes": {
        "class": "ms-bgColor-themeDark ms-bgColor-themePrimary--hover ms-fontColor-white ms-fontColor-white--hover"
      },
      "style": {
        "display": "flex",
        "flex-wrap": "wrap",
        "min-width": "130px",
        "min-height": "110px",
        "max-height":"120px",
        "margin-right": "10px",
        "margin-top": "10px",
        "box-shadow": "2px 2px 4px darkgrey",
        "background":""
      },
      "children": [ ....................

Obviously I'd like it to respond to the height of the contents but even if I add a max-height or height to the first div, it does nothing. Thanks!

Answer 1

Thanks. I figured it out when I looked at where the height is coming from:

<div class="e_b_ea5ab61a" data-automation-id="detailsListContainer" data-is-scrollable="true" style="height: 640px;">

And this is controlled by the web part option that sets the number of items to display. Sometimes we miss the obvious!