0

I want to basically wrap all my items in one div for a view. So the json I am using:

"rowFormatter": {
"elmType": "div",
"style": {
  "display": "flex",
  "flex-direction": "column",
  "align-items": "flex-start"
}

But I want to wrap all my items in 1 top level div. If I change rowFormatter, to colFormatter it blows it away.

Perhaps I need to edit as a column level and add all the items do that one div? Any suggestions?

1
  • You want to wrap all list items in div or all columns for one row in div? – Ganesh Sanap Dec 19 '20 at 9:37
0

You could use the following JSON view formatting:

{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/view-formatting.schema.json",
  "hideSelection": true,
  "hideColumnHeader": true,
  "rowFormatter": {
    "elmType": "div",
    "style": {
      "display": "flex",
      "flex-direction": "column",
      "align-items": "flex-start"
    },
    "attributes": {
      "class": "sp-row-card"
    },
    "children": [
      {
        "elmType": "div",
        "style": {
          "text-align": "left"
        },
        "children": [
          {
            "elmType": "div",
            "attributes": {
              "class": "sp-row-title"
            },
            "txtContent": "[$Title]"
          },
          {
            "elmType": "div",
            "attributes": {
              "class": "sp-row-listPadding"
            },
            "txtContent": "[$Status]"
          }
        ]
      }
    ]
  }
}

enter image description here

More information, please refer to Use view formatting to customize SharePoint

2
  • thank you this helps so much!!! Much appreciated. – Miss Potato Beans Dec 29 '20 at 15:33
  • Thanks for your reply. I am glad that my answer is helpful to you. Have a nice day! – EchoDu_MSFT Dec 30 '20 at 7:28

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.