Tagged: content slider, CSS
Hi guys,
Hope you are doing great. I have been trying to improve the look of the Content Slider arrows but I’m definitely not very good at it.
I created one here (at the bottom of the article) where I tried to make the arrows larger and with the website’s color:
But the website color does not show properly and I think it would be best if the arrows would display top left?
I think that adding a thin gray border to the whole slider would make it stand out even more.
I also added Adsense code to one of the slides and for some reason, it displays on every slide that comes before it (blocking the previous text) so I had to remove it.
Here is my CSS:
/*slider arrows css */
#top .avia-smallarrow-slider .avia-slideshow-arrows {
width: 130px;
height: 35px;
}
#top .avia-smallarrow-slider .avia-slideshow-arrows a {
background: #f89093;
color: white;
width: 50px;
height: 30px;
font-size: 25px;
}
Thank you so much!!!
Havi
Hey havi,
Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:
.avia-slideshow-arrows a:before {
line-height: 32px!important;
}
Other than that, it seems like you figured out most parts. If you would like to make further customization, please post a screenshot and show them so we can make sure that we are on the same page. You can upload your screenshots on imgur.com or Dropbox public folder and post the links here.
Best regards,
Yigit