Search code examples
cssslidermargincentercaroufredsel

css margin:0 auto does not work in firefox

Please look at the link below in different browsers.
http://www.bayaneqalam.com
The bottom logo slider is located in center of the page in Chrome and IE. But it is in right side in Firefox. What is this problem for ?
I've used carouFredSel for this slider.

Solution

  • Did you check the applied styles on Firebug? There are some inline styles added to the .caroufredsel_wrapper element which doesn't make any sense in some cases.

    By the way, there's no margin: 0 auto; CSS declaration in the styles. Here's what I got from the Firebug:

    element.style {
    bottom: auto;
    display: block;
    float: none;
    height: 100px;
    left: auto;
    margin: 0;        /* <-- the margins of all 4 aspects have been set to 0  */
    overflow: hidden;
    position: relative;
    right: auto;
    text-align: center;
    top: auto;
    width: 740px;
    z-index: auto;
}

    IMO, you could apply the margin on the element somewhere in your CSS file, and make sure that it overrides the inline style, as follows:

    .caroufredsel_wrapper {
    margin: 0 auto !important;
}