'Is there any way to align the table contents in the same line in the teams bot framework?

The below image shows how the current table is displayed on teams. We can see that the cells are not aligned properly. Using adaptive card (columnset).

The image shows how the cells are not aligned and the separator is jagged.

Below is the json payload.

{
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"type": "AdaptiveCard",
"version": "1.0",
"body": [
    {
        "type": "ColumnSet",
        "columns": [
            {
                "type": "Column",
                "items": [
                    {
                        "type": "TextBlock",
                        "weight": "bolder",
                        "text": "LMAOOOOOOOOOOOOOOO"
                    },
                    {
                        "type": "TextBlock",
                        "separator":true,
                        "text": "Apple"
                    },{
                        "type": "TextBlock",
                        "separator":true,
                        "text": "Kiwi"
                    }
                ]
            },
            {
                "type": "Column",
                "items": [
                    {
                        "type": "TextBlock",
                        "weight": "bolder",
                        "text": "YEEEEEEEEEEEEEEEEEEEE"
                    },
                    {
                        "type": "TextBlock",
                        "separator":true,
                        "text": "Fruit"
                    },{
                        "type": "TextBlock",
                        "separator":true,
                        "text": "Fruit"
                    }
                ]
            },
            {
                "type": "Column",
                "items": [
                    {
                        "type": "TextBlock",
                        "weight": "bolder",
                        "text": "Price"
                    },
                    {
                        "type": "TextBlock",
                        "separator":true,
                        "text": "2"
                    },{
                        "type": "TextBlock",
                        "separator":true,
                        "text": "1"
                    }
                ]
            }
        ]
    }
]

}

Is there a way to keep all the rows in the same line.

botframework microsoft-teams

Solution 1:^[1]

I tried it from my end & it's working fine for me:

I tried to decrease the browser size and still it's working fine:

I tested it in both Teams Desktop client and browser client and it's working fine for me

Solution 2:^[2]

Could you please try using below JSON file:

 {
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"type": "AdaptiveCard",
"version": "1.0",
"body": [
{
    "type": "ColumnSet",
    "columns": [
        {
            "type": "Column",
            "items": [
                {
                    "type": "TextBlock",
                    "weight": "bolder",
                    "text": "LMAOOOOOOOOOOOOOOO",
                    "wrap": true
                }
            ]
        },
        {
            "type": "Column",
            "items": [
                {
                    "type": "TextBlock",
                    "weight": "bolder",
                    "text": "YEEEEEEEEEEEEEEEEEEEE",
                    "wrap": true
                }
            ]
        },
        {
            "type": "Column",
            "items": [
                {
                    "type": "TextBlock",
                    "weight": "bolder",
                    "text": "Price",
                    "wrap": true
                }
            ]
        }
    ]
},
{
    "type": "ColumnSet",
    "columns": [
        {
            "type": "Column",
            "items": [
                {
                    "type": "TextBlock",
                    "separator":true,
                    "text": "Apple"
                },{
                    "type": "TextBlock",
                    "separator":true,
                    "text": "Kiwi"
                }
            ]
        },
        {
            "type": "Column",
            "items": [
                {
                    "type": "TextBlock",
                    "separator":true,
                    "text": "Fruit"
                },{
                    "type": "TextBlock",
                    "separator":true,
                    "text": "Fruit"
                }
            ]
        },
        {
            "type": "Column",
            "items": [
                {
                    "type": "TextBlock",
                    "separator":true,
                    "text": "2"
                },{
                    "type": "TextBlock",
                    "separator":true,
                    "text": "1"
                }
            ]
        }
    ]
}
  ]
 }

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	ChetanSharma-msft
Solution 2	Dharman

'Is there any way to align the table contents in the same line in the teams bot framework?

Solution 1:[1]

Solution 2:[2]

Sources

Related Questions

Solution 1:^[1]

Solution 2:^[2]