# Making CTA Image Size Responsive

**URL:** <https://community.hubspot.com/t/making-cta-image-size-responsive/22197>\
**Category:** Lead Capture Tools\
**Tags:** ctas\
**Created:** [June 27, 2020, 3:27pm UTC](https://community.hubspot.com/t/making-cta-image-size-responsive/22197 "2020-06-27T15:27:30Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![nigeld27](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/nigeld27/32/89259_2.png) [@nigeld27](https://community.hubspot.com/u/nigeld27)\
**Post date:** [June 27, 2020, 3:27pm UTC](https://community.hubspot.com/t/making-cta-image-size-responsive/22197/1 "2020-06-27T15:27:30Z")

</div>

Hello,

We have embedded our Hubspot CTA into a webpage which isn’t built on Hubspot. The CTA is working perfectly except for one factor: the size isn’t responsible.

Is it possible to make an image CTA responsible? [This Knowledge page](https://knowledge.hubspot.com/cta/where-can-i-edit-the-size-of-a-cta) below suggests that it is possible: _If you are [embedding an i](https://knowledge.hubspot.com/cta-user-guide-v2/how-to-add-a-call-to-action-cta-to-a-non-hubspot-page)[mage CTA](https://knowledge.hubspot.com/cta-user-guide-v2/how-to-add-a-call-to-action-cta-to-a-non-hubspot-page) on your non-HubSpot site, you may need to apply additional CSS declarations (such as width: 100%😉 within your stylesheet to make the image CTA responsive._

Perhaps this question should be posted in the CMS part of the Community but I can’t seem to work out which bit of the CMS codes to change. I’m making changes but it doesn’t seem to change anything. I even changed the HTML embed code to say 100% but that isn’t working.

Can anyone help, please?

---

<div class="post-metadata">

**Author:** ![stefen](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/stefen/32/29274_2.png) [@stefen](https://community.hubspot.com/u/stefen)\
**Post date:** [June 29, 2020, 1:23pm UTC](https://community.hubspot.com/t/making-cta-image-size-responsive/22197/2 "2020-06-29T13:23:14Z")

</div>

@nigeld27 do you have a link? Typically, all you would need the following CSS:

```auto
img {
 max-width: 100%;
 height: auto;
}

```

---

<div class="post-metadata">

**Author:** ![nigeld27](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/nigeld27/32/89259_2.png) [@nigeld27](https://community.hubspot.com/u/nigeld27)\
**Post date:** [June 29, 2020, 1:40pm UTC](https://community.hubspot.com/t/making-cta-image-size-responsive/22197/3 "2020-06-29T13:40:21Z")

</div>

Thanks Stefan, that’s helpful. I hate to sound like completely ignorant but do I change that in the Hubspot embed code or in our website/platform?

---

<div class="post-metadata">

**Author:** ![stefen](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/stefen/32/29274_2.png) [@stefen](https://community.hubspot.com/u/stefen)\
**Post date:** [June 29, 2020, 1:44pm UTC](https://community.hubspot.com/t/making-cta-image-size-responsive/22197/4 "2020-06-29T13:44:26Z")

</div>

@nigeld27 you’ll want to add those styles to your website where the CTA is being embedded. Also, if you don’t want to affect any other images on your website you could pinpoint the “hs-cta-img” class like so:

```auto
.hs-cta-img {
 max-width: 100%;
 height: auto;
}

```
