JPais JPais - 4 months ago 27x
jQuery Question

How to design a position absolute child div placed within overflow hidden div in bootstrap carousel

I am trying to place a badge (position absolute) on a parent div in a bootstrap carousel. Due to overflow hidden in the .carousel-inner class of bootstrap, the top part of the badge hides.
If I try to remove the overflow hiiden it works, but I need the overflow hidden as well.

Can some one pls help me to find a way out.

Thanks in advance

My Code

[1]: http://ttps://

fiddle link


Add a 15px white top border for the .item

And move the carousel-inner up with negative margin

.carousel-inner>.item {
           border-top: 15px solid #fff;
.carousel-inner {
          margin-top: -15px;