Hello!
The display is not great with the Larger Slider Testimonial on mobile. It’s two words on each line. Is it possible to change the width on mobile? Or fix this for next update!?
Thanks!
Hi youyou78!
Please try adding following code to Quick CSS in Enfold theme options under General Styling tab
@media only screen and (max-width: 480px) {
strong.avia-testimonial-name { width: 40%; float: left; }}
If that does not help, please post the link to your page where you have testimonials slider
Regards,
Yigit
Hey!
Please try adding following code instead
@media only screen and (max-width: 480px) {
#top .av-large-testimonial-slider.avia-testimonial-wrapper .avia-testimonial {
padding: 0px 50px; }}
Cheers!
Yigit
Hey!
this does not work.
Hi!
Adjust the left and right padding:
@media only screen and (max-width: 768px) {
#top .av-large-testimonial-slider.avia-testimonial-wrapper .avia-testimonial {
padding: 0px 30px;
}
#top .av-large-testimonial-slider .avia-slideshow-arrows a {
font-size: 25px;
}
.prev-slide:before {
text-indent: -30px;
}
.next-slide:before {
text-indent: 30px;
}
}
Remove browser cache then reload the page.
Regards,
Ismael
Hey!
It does not work. One or two words per line and some words are cut. Same problem with Enfold demo. http://kriesi.at/themes/enfold-business-flat/#av_section_4
Best Regards!
Hi!
which mobile device are you using? try this code:
@media only screen and (max-width: 768px) {
#top .avia-slider-testimonials.avia-testimonial-wrapper .avia-testimonial-row {
width: 140%;
left: -60px;
}
.avia-slideshow-arrows a:before {
right: 40px;
}
#top .avia-slideshow-arrows a.next-slide {
right: -30px;
}
#top .av-large-testimonial-slider .avia-slideshow-arrows a:hover {
left: -30px;
}}
After putting it in, clear browser cache.
Cheers!
Andy