|
asisnyc
|
March 13, 2019 at 2:22 pm
Hi –
We are using Authorize.net Accept and the registration checkout form is not displaying properly. I need to move the form to view the information. I’ve made an attempt to explain below. Please let me know if you need any clarifications.
The current width for our iframe checkout is 500px. If I set it to the size of the element above it, the checkout page displays properly.
672px is the size of <div class=”spco-payment-method-desc ee-attention”>
“Please provide the following billing information ” </div>.
Then following this is the registration checkout iframe set to a width of 500px.
When set to 500px, everything is pushed to the right and I have to scroll the to see all checkout information.
Below is the code that sets the width to 500px.
<iframe id=”authnet_accept_iframe” class=”embed-responsive-item accept-iframe” name=”authnet_accept_iframe” frameborder=”0″ scrolling=”auto” style=”height: 830px; width: 500px;”></iframe>
I’m not sure if this would be the fix, but how can I change this to be the same size as spco-payment-method-desc ee-attention?
Any other suggestions to fix the registration checkout page?
Thank you,
Terri
|
|
Josh
|
March 13, 2019 at 3:46 pm
Hi Terri,
Much of this will depend on your theme, but a good first step will be to add some custom CSS via the site’s Appearance > Customizer > Additional CSS page. You could start with adding this:
.accept-iframe-container {
width: 100%;
min-width: 800px;
max-width: 1000px;
margin-left: -5em;
}
#authnet_accept_iframe {
min-width: 600px;
}
Then try testing a registration. You may need to increase/decrease the percentage and em values in the above.
|
|
asisnyc
|
March 17, 2019 at 5:27 am
Thanks Josh. I’ll give it a try.
|
