Forum Discussion

joneirik's avatar
joneirik
Copper Contributor
Sep 24, 2019

Elements in a list are not showing after applying custom formatting

Hello I have a SharePoint list where the items in the list are displayed to users using custom formatting defined using a json-file. The items that are being displayed are being displayed correctl...
Lists
SharePoint Online
joneirik's avatar
joneirik
Copper Contributor
Sep 27, 2019

Norman Young 

Another update. Using the tiles didn't really solve the problem, just created anther one, not being able to set the correct view as default for all users.

What seems to break the json is "float": "left" when added to the "style" of the main div.

    "rowFormatter": {
      "elmType": "div",
      "style": {
        "display": "flex",
        "align-items": "stretch",
        "margin-bottom": "16px",
        "min-width": "150px",
        "max-width": "500px",
        "flex-grow": "1",
        "justify-content": "space-around",
        "box-shadow": "4px 4px 8px grey",
        "float": "left",
        "width": "50%",
        "padding": "5px"
      },

 When added, the scrolling dies and on a refresh of the page, only a small subset of the items in the list is displayed. 

However, not having the float also sort of breaks the desired formatting. I'll update this post if I figure something out...

Arknev's avatar
Arknev
Copper Contributor
Oct 03, 2019

joneirik I'm have the same issue. My formatting was working until a couple of days ago. I also have float:left

 

  "rowFormatter": {
    "elmType": "div",
    "style": {
      "float": "left",
      "display": "flex",
      "flex-wrap": "wrap",
      "flex-direction": "column",
      "align-items": "center",
      "justify-content": "space-around",
      "width": "160px",
      "height": "160px",
      "border-radius": "4px",
      "margin-right": "20px",
      "margin-bottom": "20px",
      "box-shadow": "0px 6px 17px -5px darkgrey"
    },

Resources