# CTA not resizing on mobile

**URL:** <https://community.hubspot.com/t/cta-not-resizing-on-mobile/15880>\
**Category:** CMS Development\
**Tags:** design-manager, css\
**Created:** [August 22, 2019, 12:22am UTC](https://community.hubspot.com/t/cta-not-resizing-on-mobile/15880 "2019-08-22T00:22:28Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![kjavan05](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/kjavan05/32/99678_2.png) [@kjavan05](https://community.hubspot.com/u/kjavan05)\
**Post date:** [August 22, 2019, 12:22am UTC](https://community.hubspot.com/t/cta-not-resizing-on-mobile/15880/1 "2019-08-22T00:22:28Z")

</div>

I am currently working on building out some landing pages and I have noticed when I check how they look on mobile, the CTAs don’t resize. I am not a developer and am relying on the templates that were created for our account and just trial and error on my end. I am hoping there is an easy css fix or something to make them resize on mobile. Please help!

 ![Screen Shot 2019-08-21 at 5.19.07 PM.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/2/4/24cb32961f530d397a23ded44f1f5a75405eabaf.png)

---

<div class="post-metadata">

**Author:** ![derekcavaliero](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/derekcavaliero/32/24634_2.png) [@derekcavaliero](https://community.hubspot.com/u/derekcavaliero)\
**Post date:** [August 22, 2019, 1:41am UTC](https://community.hubspot.com/t/cta-not-resizing-on-mobile/15880/2 "2019-08-22T01:41:45Z")

</div>

@kjavan05

Do you have a page where we could see this issue? There’s likely a CSS fix that can be done.

---

<div class="post-metadata">

**Author:** ![kjavan05](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/kjavan05/32/99678_2.png) [@kjavan05](https://community.hubspot.com/u/kjavan05)\
**Post date:** [August 23, 2019, 4:58pm UTC](https://community.hubspot.com/t/cta-not-resizing-on-mobile/15880/3 "2019-08-23T16:58:02Z")

</div>

@derekcavaliero

**Here is a link to the referenced landing page: [https://marketing.fleetsmith.com/fully-automated-mdm-0](https://marketing.fleetsmith.com/fully-automated-mdm-0)**

---

<div class="post-metadata">

**Author:** ![derekcavaliero](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/derekcavaliero/32/24634_2.png) [@derekcavaliero](https://community.hubspot.com/u/derekcavaliero)\
**Post date:** [August 24, 2019, 12:39pm UTC](https://community.hubspot.com/t/cta-not-resizing-on-mobile/15880/4 "2019-08-24T12:39:10Z")

</div>

Hey @kjavan05

Seems like you just need a max-width: 100%; CSS property added to the Custom CSS under the CTA’s “Advanced Settings” panel inside the CTA editor:

(Note that this screenshot was taken from a CTA in a portal I have access to)

 ![Screen Shot 2019-08-24 at 8.37.02 AM.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/6/0/60979da176ceec53c2d35dd5343691bdb28369ca.png)

**Do not copy the rules from my the screenshot above -** the screenshot is just a means to show you where to add the max-width: 100%; value.

That should keep your CTA from expanding past its parent container. A better means of doing this would be to add a common class to your CTAs and put that rule inside a CSS file on the site to make editing CTA styles easier (if you ever need to update 100’s of them at once).

Hopefully that helps.

---

<div class="post-metadata">

**Author:** ![kelseygalarza](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/kelseygalarza/32/6713_2.png) [@kelseygalarza](https://community.hubspot.com/u/kelseygalarza)\
**Post date:** [June 17, 2020, 10:50pm UTC](https://community.hubspot.com/t/cta-not-resizing-on-mobile/15880/5 "2020-06-17T22:50:28Z")

</div>

I’m not even sure these CTAs have this anymore? Can’t figure out how to solve this problem now.