Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Easiest thing you can do is drop the text beneath the circles. Go to the “Additional CSS” part of the dashboard and add:
html .time_circles > div {
margin-top: 0
}
Hi Andrew,
Thank you for replying to me. I’ve tried this but that doesn’t make the texts responsive. They are still on one big pile on mobile. Here is a screenshot what I see on my mobile: http://nvtl.info.transurl.nl/wp-content/uploads/2019/07/Screenshot_20190722_162439_com.android.chrome.jpg
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
That CSS is not being applied on your website. Perhaps you added it to the wrong place.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Hello,
This plugin is already responsive you can check here demo, but here some theme CSS class and plugin class are common so CSS getting conflict.
Please go to your customizer and add bellow CSS
Admin Panel->Appearance->Customize->Additional CSS
@media only screen and (max-width: 40em) {
.wpcdt-countdown-timer .time_circles {
position: relative !important;
width: 100% !important;
height: 100% !important;
}
.wpcdt-countdown-timer .time_circles > div > h4 {
font-size: 8px !important;
color: #000;
}
.wpcdt-countdown-timer .time_circles > div {
position: absolute !important;
text-align: center !important;
margin: 0 !important;
}
}
If you still facing issue then go to your theme >> style.css and add CSS code at end of the file
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
If you still facing issue then go to your theme >> style.css and add CSS code at end of the file
You should warn that this is bad practice and will cause maintenance issues in the future.
Hello,
I checked your website and also checked the timer added. Still there is issue and issue is due to css added :
.time_circles > div {
position: static !important;
text-align: center;
float: left;
width: 25% !important;
margin-top: -65px;
}
Can you please confirm this css and delete this css. Because of this css, you are facing issue.
Hope this will fix your issue 🙂
