Code being ignored in Beans & UIKit slider


Hi everyone,

Hopefully this is the correct place to ask this - I'm really racking my brain trying to figure out what exactly is causing this issue.

On a site the slider is supposed to be 600px high, and tucked underneath the header (on the home page only). For whatever reason, the

  • s are displaying as 700px high and I can't get them to behave.

    If you look at the site here and see that it's causing the section below it to be pushed down an extra 100px.

    Any help figuring out why it's doing this would be seriously appreciated!

    Thanks, C

    CSS:

    .hero-banner{
        height: 600px;
        background-color: @black;
        top: -100px;
        padding: 0px;
        position: relative;
        overflow: hidden;
    }
    
    .uk-slidenav-position{
    }
    
    .uk-slideshow{
    }
    
    .uk-slideshow li{
        height: 600px;
        padding-top: 100px;
        vertical-align: bottom;
        overflow: hidden;
    }
    
    .slide-content-container{
        vertical-align: bottom;
        height: 500px;
        width: 100%;
        display: block;
    }
    
    .slider-image{
        display: inline-block;
        vertical-align: bottom;
    }
    
    .slider-cover{
        display: inline-block;
        width: 40%; 
        text-align: center;
        vertical-align: bottom;
    }

    I can also share the html/php if needed.

    (PS I tried to share code via CloudUp as advised above but apparently you need a code in order to sign up and public registration isn't open.)

  • Write a reply

    Login or register to write a reply, it's free!