question

araja avatar image
araja asked ·

Issue in clover hosted iframe application running on iphone browser

I have implemented clover hosted iframe application. It looks good on all browsers including android browser. The only problem I am facing in running on iphone browser. All credit card input fields appear truncated as shown in image below.


Also, here is the codepen example: https://codepen.io/gareth-dsouza/pen/MWKbWwv





Paymentsclover developer community
iphone.jpeg (28.7 KiB)
10 |2000 characters needed characters left characters exceeded

Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

sdesai avatar image
sdesai answered ·

We ended up adding 0px padding and margin to inputs to work around this:

'card-number input': {

'font-size': '16px',

'padding': '0px',

'margin': '0px',

}

2 comments Share
10 |2000 characters needed characters left characters exceeded

Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

The ecomm team also recommended adding css to resolve the issue.

0 Likes 0 · ·
araja avatar image araja David Marginian ♦♦ ·

Thanks. It works.

0 Likes 0 · ·
David Marginian avatar image
David Marginian answered ·

I have let the ecomm team know.

1 comment Share
10 |2000 characters needed characters left characters exceeded

Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

Thanks. Can this issue be fixed? Is there any ETA for this?

0 Likes 0 · ·

Welcome to the
Clover Developer Community