NickDuto
NickDuto

Reputation: 31

How do I remove the invisible box surrounding the Bootstrap carousel indicators?

In Bootstrap carousels there is apparently an invisible box that surrounds the indicator circles. I gave it a red border so I could play with it. All of my attempts to resize it or give it a different z-index only add to the problem.. I want to get rid of it because it blocks the items on the slide from being clickable. Does anyone know what its purpose is and how to disable it? I would like to keep the indicators themselves, but not the oversized invisible thing. Thanks in advance!

http://176.32.230.42/duto.com/experiment/index.html

https://github.com/NickDuto/experiment

Upvotes: 1

Views: 106

Answers (1)

hector22x
hector22x

Reputation: 104

You can use pointer-events:none for the div, and then the items under it will be clickable. If you need the indicators to be clickable, you can use pointer-events:all; on them.

http://caniuse.com/#feat=pointer-events

https://css-tricks.com/almanac/properties/p/pointer-events/

Upvotes: 1

Related Questions