Search code examples
cssfirefoxtwitter-bootstrappositioning

Bootstrap Carousel Firefox Positioning


I am using the Bootstrap Carousel on my site - everything is working as expected - only Firefox is making trouble.

The .carousel-inner is only shown when I set:

.carousel-inner{ 
    overflow:visible;
    width:auto;
}

But now the scrollbars are showing up in every other browser, when the animation is running. Keeping it like

.carousel-inner{ 
    overflow:hidden;
    width:auto;
}

will hide the scrollbars, but the whole div gets positioned to the right somehow in FF.

Where is my error, where did I mess up, or is this a FF positioning bug?


Solution

  • The cause of the problem in Firefox is this:

    .carousel {
        margin: -1px 0 0 -1px;
    }
    

    Specifically, the negative margin-top.