Are you experiencing your AEvent timer displaying in two lines on mobile devices?
In this tutorial, we'll show you a simple fix to ensure your timer appears on a single line. This will enhance the visual appeal of your pages and provide a seamless user experience.
Every page builder is different, SO if yours needs this, here is the solution!
By following this tutorial, you'll learn how to adjust the display of your AEvent timer on mobile devices. With a few easy steps, you'll have your timer appearing on a single line, eliminating any formatting issues.
Step-By-Step Tutorial:
Step 1: Access the Settings
Look for the "Settings" tab on the page.
Within the settings panel, locate the "Custom CSS" box. This box allows you to add custom code to modify the appearance of elements on your page.
⚠️ NOTE ⚠️
If there is already an existing code in the box, leave it untouched.
We will add our code below it.
CSS Code:
.countdown-row {
display: flex!important;
justify-content: center;
flex-wrap: nowrap;
}
Step 2: Save and Exit
After pasting the code, exit the settings panel to return to your page editor.
Save your changes by clicking on "Save."
Step 3: Refresh the Page
To see the changes take effect, refresh the page where you have the AEvent timer.
Once the page has refreshed, you will notice that the timer is now displayed on a single line, resolving the issue.
Congratulations! You've successfully adjusted the display of your AEvent timer to appear on a single line on mobile devices. By following the steps outlined in this tutorial, you've enhanced the visual appeal of your pages and provided a seamless user experience. Please feel free to reach out to us if you have any further questions or require additional assistance.
If you have any further questions or need additional support, please don't hesitate to ask. We're here to help!