Jump to content

List / Testimonial Arrow Image Not Showing On Mobile

Recommended Posts

I've put in custom CSS to change out the left and right arrows for the list section of my site that I'm using as testimonials, but when I switch the mobile screen the images are not displayed - instead it shows the standard ones. I can't find the right identifier to add additional CSS to make this change. Any help is appreciated:

website: www.luckydogmobilegroomers.com - it's under the "If Dogs Could Talk" section:

[data-section-id="6408136c67a6c3470fdc2532"] {
svg.user-items-list-carousel__arrow-icon {
    display: none !important;
}
.user-items-list-carousel__arrow-icon-background.user-items-list-carousel__arrow-icon-background-area {
    background-image: url(https://images.squarespace-cdn.com/content/v1/63f5157592478e6d25224db2/837acc5c-0c8d-475e-9193-e13ec2023aab/leftarrow.png?format=300w);
    background-size: contain;
    background-repeat:no-repeat;
    background-position: center center;
}
button[class*="--right"] .user-items-list-carousel__arrow-icon-background.user-items-list-carousel__arrow-icon-background-area {
    background-image: url(https://images.squarespace-cdn.com/content/v1/63f5157592478e6d25224db2/bbf291a2-7b1e-4f94-8a42-1b6cd6b38c99/rightarrow.png?format=300w);
}}

.user-items-list-carousel__arrow-icon-background.user-items-list-carousel__arrow-icon-background-area {
    background-color: transparent !important;
}

Link to comment
  • Replies 1
  • Views 119
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.