Some time web payment form height issue?


The web-payment-sdk is being used to build the payment form, and it’s working fine. However, there are times when there is a height issue. Please check the screenshot attached.


When the form field initially loads are you calling recalculateSize()? Is there anything changing on the page that would initially make the form render like to image? :slightly_smiling_face:

According to the team when the card container element is contained within an element that has display: none (in this case), it will behave erratically. You’ll need to call the recalculateSize() function after the radio button is clicked to handle this edge case and the card component will automatically resize itself. Alternatively, you could also not use display: none on any of the containers where our card inputs are rendered. :slightly_smiling_face: