Search code examples
jquerycsszurb-foundationorbit

Scaling orbit slider

I'm working on a website that can be found there: http://odesktestanswers2013.com/Metareviewer/

I'm working on a 1920px wide monitor and I noticed on my girlfriend laptop (a 14inch mac with Safari) that the slider displays two black strips above and below the slider.

My sliders' pictures are 1920px but I thought they would just scale (and that I obviously wouldn't have those black strips).

Anybody knows where that's coming from ?

Solution

  • The problem is with the background-size values that you have defined. THey are using a % of the container. If you change your background-size to cover and your background-position to center center is will fix your problem

    .main-wraper-present2 {
    background: url("../images/unes/une[2].jpg") no-repeat scroll center center #000000;
    background-size: cover;
}