Svatex-elements | Stripe Developers | Page 1

hybrid coral Sep 9, 2021, 9:51 AM

#

@cerulean parcel try adding class=field (actually, class="form-control" I think) to the containing div, this happens with bootstrap sometimes

#

or basically give it the same class as any other HTML form elements on the page

cerulean parcel Sep 9, 2021, 9:55 AM

#

Iam using styled components, so maybe thats the reason... Anyway className={"form-control"} kind of works, but its still not 100% width :/

hybrid coral Sep 9, 2021, 9:57 AM

#

hard to say without looking directly at the page and its CSS myself! It is 100% width, but it's constrained to the width of the div you mount the Element to, so you need to style that div to have more horizontal room

cerulean parcel Sep 9, 2021, 9:57 AM

#

And it do not work for CartdElement 😦

#

Sure I will try, anyway thanks for help!

#

Stupid me... Works perfectly! Thanks

#

hybrid coral Sep 9, 2021, 10:02 AM

#

great!

cerulean parcel Sep 9, 2021, 10:02 AM

#

Well actually one more question I found out that there should be possible to change padding in CardElement but it also do not works :?

#

hybrid coral Sep 9, 2021, 10:04 AM

#

yeah it only works for the IDEALBankElement (https://stripe.com/docs/js/appendix/style#style_object-padding)

Stripe JavaScript SDK reference – Style object

Complete reference documentation for the Stripe JavaScript SDK.

#

for the CardElement you would add padding to the containing div

#

so https://jsfiddle.net/muczL2xq/ for instance

#

not entirely sure how that works with React though

#Svatex-elements