CODEWITHSUNDEEP
htmlcsstwitter-bootstrap
Ojs
Ojs

Reputation: 954

overflow-x:auto not working in safari and firefox

I've checked several topics about this problem but none of them worked for me. I'm using Bootstrap. Here is my code.

TEMPLATE :

<div class="table-responsive for_safari">
    <table class="table" style="width:5000px;">
        <tr>
            {partners_info}                         
                <td>
                    <a href="{link_partner}">
                        <div style=" background-image: url('{img_partner}');" class="give_size">
                        </div>
                    </a>
                </td>                       
            {/partners_info}                        
        </tr>
    </table>
</div>

CSS : 

.give_size {
    background-repeat: no-repeat !important;
    background-size: 200px auto !important;
    background-position: center !important;
    height: 200px !important;
}

.for_safari {
    overflow-x: scroll; /* has to be scroll, not auto */
    -webkit-overflow-scrolling: touch;
}

Scroll doesn't work in Safari and Firefox and I can't figure out why. Everything works fine in Chrome. Here is link where you can actually see the problem. Enter the page and scroll down. Hope you can help. Thanks.

Upvotes: 1

Views: 5016

Answers (1)

Ojs
Ojs

Reputation: 954

I figured it out. The problem was inside table class. "max-width:100%" was not necessary. Thanks anyway :)

Upvotes: 1

Related Questions