I've created several SharePoint lists with custom views in order to include them in web parts on web pages.
Normally, these tiles are supposed to be displayed side by side but since yesterday I've noticed that they are displayed one below the other.
Do you have a solution?
Here is the JSON code used:
{
"$schema": "https://developer.microsoft.com/json-schemas/sp/view-formatting.schema.json",
"hideColumnHeader": true,
"hideSelection": true,
"rowFormatter": {
"elmType": "div",
"style": {
"float": "left",
"margin-right": "10px",
"margin-top": "10px"
},
"children": [
{
"elmType": "a",
"attributes": {
"href": "[$ilinkfr]",
"target": "=if([$itarget] == True, '_blank', '')"
},
"style": {
"text-decoration": "none",
"position": "relative"
},
"children": [
{
"elmType": "div",
"attributes": {
"class": "ms-bgColor-themePrimary ms-bgColor-themeDarkAlt--hover ms-fontColor-white ms-fontColor-white--hover"
},
"style": {
"width": "70px",
"height": "70px",
"float": "left",
"padding": "15px"
},
"children": [
{
"elmType": "div",
"style": {
"text-align": "center",
"margin": "auto"
},
"children": [
{
"elmType": "div",
"attributes": {
"iconName": "[$iicon]",
"class": "ms-fontSize-su"
},
"style": {}
},
{
"elmType": "div",
"attributes": {
"class": "sp-row-title"
},
"txtContent": "[$ititlefr]",
"style": {
"position": "absolute",
"padding": "7px",
"bottom": "0",
"left": "0",
"right": "0",
"text-align": "center",
"font-size": "14px"
}
}
]
}
]
}
]
}
]
}
}