'dark background-color when pressing button

I try to implement a carousel with buttons to go back and forth. When I press the buttons on my pc there is no problem but once I press them on my phone the background-color turns gray.

image

Neither in my CSS nor in my HTML is a background-color which could interfere…

.prev-screen,
  .next-screen {
    align-self: stretch;
    background: none;
    border: 0;
    margin-top: 40px;
    color: rgba(#000, 0.25);
    cursor: pointer;
    font-size: 24px;
    opacity: 1;
    outline: none;
    padding: 16px;
    transform: scale(1);
    z-index: 1000;

    &:hover,
    &:active {
      color: #000;
      transform-origin: center;
      transform: scale(1.25);
    }

    &:disabled {
      opacity: 0;
    }
  }

What could lead to that black background?

htmlcsscarousel


Solution 1:[1]

The CSS you provided doesn't describe exactly what you have written to change the background color. What code have you wrote to add the active class to the background? Either way, it might be because of the event listener you have set up to alter css properties... if it works on pc and not on mobile... this might help you out?, or at least guide you on your way... On click event for mobile?.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Michael Martell

Related Questions