Forum Discussion

najin91's avatar
najin91
Copper Contributor
Feb 05, 2024

Can't add border onto Adaptive Cards images or render images in tables in Teams

Hi there - I'm trying to add a border to an image, but I'm running into problems. One, it seems like the style feature for an image doesn't allow actual css, instead it allows me to specify person or...
developer
microsoft teams
Prasad_Das-MSFT's avatar
Prasad_Das-MSFT
Icon for Microsoft rankMicrosoft
Feb 05, 2024

najin91 - Thanks for raising your issue. Could you please let us know if you are facing this issue in Teams classic or New Teams?

Also, regarding your question about the version support of Adaptive Cards in Microsoft Teams, as of now, Microsoft Teams supports Adaptive Cards version 1.5 or below. There is no official information available about when higher versions will be supported.

  • najin91's avatar
    najin91
    Copper Contributor
    Feb 06, 2024
    New Teams: Version 23335.208.2601.834 (23335.208.2601.834)

    Also, Teams on mac specifically.
    • Prasad_Das-MSFT's avatar
      Prasad_Das-MSFT
      Icon for Microsoft rankMicrosoft
      Feb 06, 2024

      najin91 - To add a border to an image in an Adaptive Card in Microsoft Teams, you can use a Container element with a style property set to emphasis .Then, place the Image element inside the Container.

      {
    "type": "AdaptiveCard",
    "body": [
        {
            "type": "Container",
            "style": "emphasis",
            "items": [
                {
                    "type": "Image",
                    "url": "https://adaptivecards.io/content/cats/1.png"
                }
            ]
        }
    ],
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "version": "1.2"
}

       

       

       

      Thanks, 

      Prasad Das

      ------------------------------------------------------------------------------------------ 

      If the response is helpful, please click "**Mark as Best Response**" and like it. You can share your feedback via Microsoft Teams Developer Feedback link. Click here to escalate. 

Resources