- 10 Mar 2025
- 1 Minute To Read
-
Print
-
DarkLight
-
PDF
How do I align and resize two buttons in a Pop-up?
- Updated On 10 Mar 2025
- 1 Minute To Read
-
Print
-
DarkLight
-
PDF
You created a Pop-up and you want to add two call-to-action buttons to it along with text. However, for some reason the buttons are not aligned in the same row. Fix the alignment problem by using the HTML and CSS code view. You can also use the Button Resize option on the Pop-up button to further adjust the size and spacing of the buttons correctly.
Follow these steps to fix it with simple HTML and CSS code changes:
Click the corner of any button (either the Skip or Register button).
Go to the code view.
Go to the HTML code view, locate the respective code for each button, and then adjust their widths.
Switch to the CSS code view and adjust the space between the two buttons.
Note:
After making the changes in the HTML and CSS code view, click Run to ensure all the changes reflect.
![]()
Here’s the Pop-up with the aligned buttons along with the text in the same row.
Info:
You can further align the spacing between the buttons in the Pop-up using the Button Resize icon.
Follow the steps to resize the Pop-up buttons:
To change the button configurations, hover your cursor over the button and then click to open the button configuration menu.
Click the Button Resize icon.
Once you click the resize option, choose a desired height and width to adjust the buttons accordingly.
For instance, if you set the Register button height to 50 px and the width to 100 px, here’s how the button appears:
![]()