The default size of the Express button is:
- Width: 308px
- Height: 50px
Supported Button Size Ranges:
- Width: 145px to 500px
- Height: 35px to 60px
How to resize based on fixed values
To resize the button you will need to add a class to the klarna-express-button element. You can then target this class in a custom css definition with the desired width and height.
How to resize based on page responsiveness
Much like any other element on your page, the Express Button can be resized depending on different viewports via media queries.
For example, if you want your button to use the full screen width on a screen up to 500px and otherwise have your button be 35px tall and 190px wide, you can achieve that like so:
How to resize multiple buttons
If you have multiple buttons on your page and need them to be sized differently, we recommend adding a different css class to each button that requires a custom size.
And then implement your styles like so: