Search code examples
bootstrap-tabs

slick slider does't work perfectly in the bootstrap 3 tab content

slick slider does't work perfectly in the bootstrap 3 tab content and i searched for solution but and found this one 

.tab-content > .tab-pane,
.pill-content > .pill-pane {
    display: block;     /* undo display:none          */
    height: 0;          /* height:0 is also invisible */ 
    overflow-y: hidden; /* no-overflow                */
}


.tab-content > .active,
.pill-content > .active {[![enter image description here][1]][1]
    height: auto;       /* let the content decide it  */
} /* bootstrap hack end */

but when i try to run it the slider works so fine but the arrows disappear and the is scrollbar-x is showen :S :S :S

http://prntscr.com/82m34c

Solution

  • try this

    .tab-content > .tab-pane:not(.active), 
.pill-content > .pill-pane:not(.active) {
    display: block;
    height: 0;
    overflow-y: hidden;
}