payment form rendering at less than 100% width.

[Kate]

C&P Account 90632
I've made a payment form, and initially it loaded as previewed, but I updated some of the text, and while it still previews the same, it renders more narrowly. I am using a widescreen laptop, not a mobile device.

The Campaign is Dance-a-thon 2020 Team Diana and the form is Dance-a-thon team Diana.

Here is a link to the embedded form page. https://www.keenchicago.org/team-diana
the source code is <script class="CnP_formloader" src="https://resources.connect.clickandpledge.com/Library/iframe-1.0.0.min.js?637159816651470482" data-guid="c6e2b728-bc45-403c-8235-6b089fb56e56"></script>
<div id="CnP_inlineform">&nbsp;</div>

Here is what it used to look like, and still looks like in preview.

https://drive.google.com/file/d/164zDZvvwxiN1nZE9YKigERTaIIZdLCkD/view?usp=sharing

I checked with our web developer, and he said the width of the iframe would need to be changed at C&P.

Any suggestions?

[CnP.Support.AM]

Good day @Kate

We have investigated the case and we found that due to the max-width conflict in the css of your website and our form it is getting narrowed. Our forms follow the bootstrap framework and it changes width according to the media queries in the bootstrap.

Please see:



If you can change the max-width of a class=""page-width" from 960px TO 992px as shown in the above-hightlighted area on your website will address the issue.

[Kate]

You're the best. I'll forward to my developer.