Is it possible to use full width adaptive cards in a carousel on Microsoft Teams?

Question

I'm using

• Microsoft Teams
• Adaptive Cards 1.4
• Node.js Bot Framework SDK 4.14.1

I tried the following URL sample with the full-width property.

https://learn.microsoft.com/en-us/microsoftteams/platform/task-modules-and-cards/cards/cards-reference#example-of-a-carousel-collection

But, the property doesn't work.

Is this possible?

My code:

await context.sendActivity({
      attachmentLayout: "carousel",
      attachments: [
        {
          "contentType": "application/vnd.microsoft.card.adaptive",
          "content": {
            "type": "AdaptiveCard",
            "version": "1.4",
            "msteams": {
              "width": "Full"
            },
            "body": [
              {
                "type": "Container",
                "items": [
                  {
                    "type": "TextBlock",
                    "size": "extraLarge",
                    "weight": "bolder",
                    "text": "Welcome to Employee Connect",
                    "height": "stretch"
                  },
                  {
                    "type": "TextBlock",
                    "size": "medium",
                    "weight": "bolder",
                    "text": "Add events to your calendar",
                    "height": "stretch"
                  },
                  {
                    "type": "TextBlock",
                    "weight": "bolder",
                    "text": "The bot can send \r\rnotification to remind \r\ryou about the latest \r\revents and trainings.",
                    "wrap": true,
                    "height": "stretch"
                  },
                  {
                    "type": "ColumnSet",
                    "columns": [
                      {
                        "type": "Column",
                        "items": [],
                        "height": "stretch"
                      }
                    ]
                  },
                  {
                    "type": "ColumnSet",
                    "columns": [
                      {
                        "type": "Column",
                        "items": [],
                        "height": "stretch"
                      }
                    ]
                  }
                ]
              }
            ],
            "actions": [
              {
                "type": "Action.Submit",
                "title": "Let's get started"
              }
            ]
          }
        },
        {
          "contentType": "application/vnd.microsoft.card.adaptive",
          "content": {
            "type": "AdaptiveCard",
            "version": "1.4",
            "msteams": {
              "width": "Full"
            },
            "body": [
              {
                "type": "Container",
                "items": [
                  {
                    "type": "TextBlock",
                    "size": "large",
                    "weight": "bolder",
                    "text": "Employee connect"
                  },
                  {
                    "type": "TextBlock",
                    "text": "The bot can send notifications \r\rto remind you about the latest \r\r events and training",
                    "wrap": true,
                    "maxWidth": 2
                  },
                  {
                    "type": "ColumnSet",
                    "columns": [
                      {
                        "type": "Column",
                        "items": [],
                        "height": "stretch"
                      }
                    ]
                  },
                  {
                    "type": "ColumnSet",
                    "columns": [
                      {
                        "type": "Column",
                        "items": [],
                        "height": "stretch"
                      }
                    ]
                  }
                ]
              }
            ],
            "actions": [
              {
                "type": "Action.Submit",
                "title": "Let's get started"
              }
            ]
          }
        },
        {
          "contentType": "application/vnd.microsoft.card.adaptive",
          "content": {
            "type": "AdaptiveCard",
            "version": "1.4",
            "msteams": {
              "width": "Full"
            },
            "body": [
              {
                "type": "Container",
                "items": [
                  {
                    "type": "TextBlock",
                    "size": "large",
                    "weight": "bolder",
                    "text": "Employee Connect final"
                  },
                  {
                    "type": "TextBlock",
                    "weight": "bolder",
                    "text": "Create and manage your tasks",
                    "wrap": true
                  },
                  {
                    "type": "TextBlock",
                    "text": "The app identifies all your pending tasks \r\r and helps you manage everything at \r\r one place.",
                    "wrap": true
                  },
                  {
                    "type": "TextBlock",
                    "weight": "bolder",
                    "text": "Try these commands \r\r- Pending Submissions \r\r- Pending Approvals- My Tools",
                    "wrap": true,
                    "height": "stretch"
                  }
                ]
              }
            ],
            "actions": [
              {
                "type": "Action.Submit",
                "title": "Let's get started"
              }
            ]
          }
        }
      ],
    });

Result:

Answer 1

I've reported this issue a while ago to Microsoft, something about the same time this topic was created. They've done a hotfix to have it aligned with an older version (?) but will fix the actual issue later on. You can track it on the following URL where they keep us updated:

https://github.com/MicrosoftDocs/msteams-docs/issues/4394

(I couldn't just add a reply because my reputation is not high enough yet.)

Answer 2

We tried to repro this at our end on web client and we were able to use full width adaptive cards in a carousel.

However we see the above issue is repro'ing on desktop, adaptive card is not shown in full width. We have raised it internally.

Desktop : Web client: