Where do I add style word-break keep-all in Microsoft Lists for JSON

[Matthew Carter]

Sorry I am having trouble figuring out where to add some JSON for word wrap.

I don't know where to add style word-break keep all

I have a Microsoft Lists that I'd like to have the words wrap in Gallery mode.

For the top line, no need, no problem, the next line, some could use some word wrap.

If I make ALL of them 1024 it will be a "list" instead of this gallery.

I found online that people use style work break keep all.  I am not sure where to put it.  I tried to just ADD it in the code and it is obviously NOT working when I do preview.

This is the start of the JSON

{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/tile-formatting.schema.json",
  "height": 135,
  "width": 254,
   "style": {
    "word-break": "keep-all"
  },
  "hideSelection": false,
  "fillHorizontally": true,
  "formatter": {
    "elmType": "div",
    "attributes": {
      "class": "sp-card-container"
    },
    "children": [
      {
        "elmType": "button",
        "attributes": {
          "class": "sp-card-defaultClickButton",
          "role": "presentation"
        },
        "customRowAction": {
          "action": "defaultClick"
        }
      },
      {
        "elmType": "div",
        "attributes": {
          "class": "ms-bgColor-white sp-css-borderColor-neutralLight sp-card-borderHighlight sp-card-subContainer"
        },
        "children": [
          {
            "elmType": "div",
            "attributes": {
              "class": "sp-card-displayColumnContainer"
            },
            "children": [
              {
                "elmType": "p",
                "attributes": {
                  "class": "ms-fontColor-neutralSecondary sp-card-label"
                },
                "txtContent": "[!Title.DisplayName]"
              },
              {
                "elmType": "p",
                "attributes": {
                  "title": "[$Title]",
                  "class": "ms-fontColor-neutralPrimary sp-card-content sp-card-highlightedContent",
                  "role": "heading",
                  "aria-level": "3"
                },
                "txtContent": "=if ([$Title] == '', '–', [$Title])"
              }
            ]
          },
          {
            "elmType": "div",
            "attributes": {
              "class": "sp-card-lastTextColumnContainer"
            },
            "children": [
              {
                "elmType": "p",
                "attributes": {
                  "class": "ms-fontColor-neutralSecondary sp-card-label"
                },
                "txtContent": "[!Guests.DisplayName]"
              },
              {
                "elmType": "div",
                "attributes": {
                  "class": "sp-card-content sp-card-formatterRef"
                },
                "children": [
                  {
                    "columnFormatterReference": "[$Guests]"
                  }
                ]
              }
            ]
          }
        ]
      }
    ]
  }
}

[#2]

@Matthew Carter

Hi Matt, not sure if you figured this out but I just did.

Remove the below class in your JSON

sp-card-label

So for example for the Name (display name of a document library)

"children": [

{

"elmType": "p",

"attributes": {

"class": "ms-fontColor-neutralSecondary sp-card-label"

},

"txtContent": "[!FriendlyTitle.DisplayName]"

},

and you will find it stops forcing the text wrap.

Note if you're using a custom line of text field it is  - sp-card-content