How to remove shadow from glyphicons in bootstrap carousel

twitter-bootstrap glyphicons
user4583569 picture user4583569 · Mar 10, 2015 · Viewed 17k times · Source

I have a bootstrap carousel on my site. The right and left arrow glyphicons which come with it are surrounded by a square grey box of shading. I was wondering if someone could tell me how to remove the shading so I just have the arrows. Do I have to overwrite bootstrap's css somehow?

Answer

jsg picture jsg · Mar 10, 2015

I've had this issue before, just add this as bootstrap offers the shadow as a background image or/and as a filter

.carousel-control.left, .carousel-control.right {
   background-image:none !important;
   filter:none !important;
}

And as suggested before i would change the opacity, but to 1

Related questions

Add Bootstrap Glyphicon to Input Box

How can I add a glyphicon to a text type input box? For example I want to have 'icon-user' in a username input, something like this:

Read More
How Do I Make Glyphicons Bigger? (Change Size?)

I would like to make the globe glyphicon bigger so that it covers up a large portion of the page (it's a vector image). It's not in a button or anything; it's just alone. Is there a way to do …

Read More
Bigger Glyphicons

How do I make bigger Glyphicons in twitter bootstrap 3.0 (not 2.3.x). This code will make my glyphicons big: <button type="button" class="btn btn-default btn-lg"> <span class="glyphicon glyphicon-th-list"> </span> </button> How …

Read More