Hi @kiky1991,
I can see what you mean with the two different layouts, that inconsistency in how the Stripe fields render can definitely be confusing, and you are right to look into how it is being generated.
The key thing here is that these fields are rendered using Stripe Elements, which are controlled by Stripe’s own JavaScript and are designed to be responsive. This means the layout can automatically adjust based on factors like container width, screen size, and sometimes even timing during page load, which is why you may notice it changing on refresh.
At the moment, WooCommerce itself does not provide a direct way to force a fixed layout for those fields, since the structure is handled by Stripe. However, here are a few things you can check or try:
• Ensure there are no CSS rules from your theme or custom styles affecting the Stripe container width or flex behavior
• Test with a default theme like Storefront to see if the inconsistency persists
• Check if any optimization plugins, caching, or JS minification could be affecting how Stripe Elements initializes
• Make sure your checkout container has a consistent width across loads
If you are looking to enforce a very specific layout, that would typically require custom CSS or JS targeting the Stripe Elements wrapper, though this falls outside standard plugin support.
You can also review how Stripe Elements behaves and what customization options are available here: https://docs.stripe.com/payments/elements
If you can share your site URL or a quick screen recording via https://snipboard.io, it would help take a closer look at what might be influencing the layout on your setup.