How to display the adaptive card as Full width in teams 1:1 chat?

ABHISHEK KUMAR 61 Reputation points
2025-04-11T14:07:57.08+00:00

The Adaptive card attachments are not coming in the Full width of the teams 1:1 chat.
Here the msteams: {"width":"full"} is added a property to achieve full width. But it is not coming in full width

User's image

This is the sample json:

{  "type": "AdaptiveCard",  "version": "1.5","msteams":{"width":"full"},  "body": [{  "type": "ColumnSet",  "columns": [    {      "type": "Column",      "width": "stretch",      "items": [        {          "type": "TextBlock",          "text": "Header 1",          "weight": "bolder"        }      ]    },    {      "type": "Column",      "width": "stretch",      "items": [        {          "type": "TextBlock",          "text": "Header 2",          "weight": "bolder"        }      ]    },    {      "type": "Column",      "width": "stretch",      "items": [        {          "type": "TextBlock",          "text": "Header 3",          "weight": "bolder"        }      ]    }  ]},{  "type": "ColumnSet",  "columns": [    {      "type": "Column",      "width": "stretch",      "items": [        {          "type": "TextBlock",          "text": "Row 1 - Col 1"        }      ]    },    {      "type": "Column",      "width": "stretch",      "items": [        {          "type": "TextBlock",          "text": "Row 1 - Col 2"        }      ]    },    {      "type": "Column",      "width": "stretch",      "items": [        {          "type": "TextBlock",          "text": "Row 1 - Col 3"        }      ]    }  ]}  ],  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json"}
Microsoft Teams Development
0 comments No comments
{count} votes

1 answer

Sort by: Most helpful
  1. Prasad-MSFT 8,981 Reputation points Microsoft External Staff Moderator
    2025-04-14T05:08:27.89+00:00

    Hi ABHISHEK KUMAR we tried using the same card JSON with/without full width property and the card is rendering as below:

    Without msteams: {"width":"full"}
    User's image

    With msteams: {"width":"full"}

    User's image

    Thanks, 

    Prasad Das

    ************************************************************************* 

    If the response is helpful, please click "Accept Answer" and upvote it. You can share your feedback via Microsoft Teams Developer Feedback link. Click here to escalate.


Your answer

Answers can be marked as Accepted Answers by the question author, which helps users to know the answer solved the author's problem.