I use bootstrap slider on a page. I want to use Left and Right buttons only to scroll the images, but standard bootstrap slider uses a wide clickable areas from the left and the right of the slider and this areas overlap the slider. How can I get rid of them?
I know that the class responsible for this property is carousel-control and if I change its properties top and bottom to top:50%; bottom:50% in Google dev tool everything works fine. But if I try to set this value in my html file it does not work. Here is the html code of the element:
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev" style="background-image: none !important; margin-left: -10% !Important; top: 50% !Important; bottom: 50% !Important;">
Css file, bootstrap and jQuery is connecred by cdn. So I'd prefer to change the style inline. What is wrong with the code above?