I have an Adaptive Card with 4 buttons on it, but the issue is that my 4th button is going over to the next line. I want to fit all the buttons in a single row, so is there any way i can increase the width of the Adaptive Card to align the buttons in a row.
I'm using bot framework v3 (C#).
Add the below property to adaptive card to set the width to use the full window. { "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", "type": "AdaptiveCard", "version": "1.2", "msTeams": { "width": "full" }, "body": [...] } Works like a charm.
Select Create. Select New Step. Search for Microsoft Teams, and then select Post an adaptive card to a Teams channel and wait for a response as the action. Select the Team and the Channel to which you'd like to post the card.
Adaptive Cards are actionable snippets of content that you can add to a conversation through a bot or message extension. Using text, graphics, and buttons, these cards provide rich communication to your audience. The Adaptive Card framework is used across many Microsoft products, including Teams.
Support for Adaptive Cards Teams platform supports v1. 4 or earlier of Adaptive Card features for bot sent cards and action based message extensions.
Add the below property to adaptive card to set the width to use the full window.
{
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"type": "AdaptiveCard",
"version": "1.2",
"msTeams": { "width": "full" },
"body": [...]
}
Unfortunately, you cannot align your button side to side at this moment. For button there is not such a property
. As you can see below:
Though you could align other element like Input.Text
or TextBlock
inside ColumnSet
but it doesn't support button inside.
See the screen shot below:
You could have a look more about adaptive card property here.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With