WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Template css wrong for slider imges (2 posts)

  1. craig parker
    Member
    Posted 1 year ago #

    Tried every fix I could find but cannot centre image in slider underneath caption.

    Template was downloaded from template-monster and self installed. Problem occured immediately and no CSS was changed beforehand.

    Half the image is missing to the left and caption box continually stays to the right of image no matter how image and wrapper is moved or margins edited.

    This is the original template code for slider

    /* Slider
    ---------------------------------------- */

    #slider-wrapper {
    position: relative;
    width: 100%;
    height: 541px;
    overflow: hidden;
    z-index: 1;
    }

    #slider {
    background: url(images/loading.gif) no-repeat 50% 50%;
    width: 2120px;
    height: 541px;
    margin: 0 0 0 -1060px;
    position: absolute;
    top: 0;
    left: 50%;
    }

    #slider img {
    position:absolute;
    margin: 0px;
    top:0px;
    left:0px;
    display:none;
    }
    #slider a {
    border:0;
    display:block;
    }

    /* The Nivo Slider styles */
    .nivoSlider {
    position:relative;
    }
    .nivoSlider img {
    position:absolute;
    top:0px;
    left:500px;
    }
    /* If an image is wrapped in a link */
    .nivoSlider a.nivo-imageLink {
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    border:0;
    padding:0;
    margin:0;
    z-index:60;
    display:none;
    }
    /* The slices in the Slider */
    .nivo-slice {
    display:block;
    position:absolute;
    z-index:50;
    height:100%;
    }
    .nivo-box {
    display:block;
    position:absolute;
    z-index:5;
    }
    /* Caption styles */

    .nivo-caption {
    background: url(images/caption.png) no-repeat 0% 0%;
    width: 446px;
    height: 446px;
    overflow: hidden;
    letter-spacing: -2px;
    line-height: 37px;
    font-family: 'Open Sans', sans-serif;
    font-size: 40px;
    font-weight: 600;
    text-align: center;
    color: #bdf5ff;
    position: absolute;
    top: 95px;
    left: 1088px;
    z-index: 89;
    opacity: 0.8; /* Overridden by captionOpacity setting */
    }

    .nivo-caption .nivo-caption-inner {
    margin: 0;
    padding: 108px 60px 0 60px;
    }

    .nivo-caption a {
    display: inline !important;
    }

    .nivo-html-caption {
    display:none;
    }
    /* Direction nav styles (e.g. Next & Prev) */
    .nivo-directionNav a {
    position:absolute;
    top:45%;
    z-index:99;
    cursor:pointer;
    }
    .nivo-prevNav {
    left:0px;
    }
    .nivo-nextNav {
    right:0px;
    }
    /* Control nav styles (e.g. 1,2,3...) */
    .nivo-controlNav {
    position:absolute;
    width:950px;
    margin: 0 0 0 -475px;
    height:20px;
    left:50%;
    bottom:10px;
    text-align:center;
    }
    .nivo-controlNav a {
    position:relative;
    z-index:99;
    cursor:pointer;
    display:inline-block !important;
    margin: 0 5px 0 0;
    padding: 3px;
    line-height: 20px;
    font-size: 13px;
    font-weight: bold;
    text-decoration: none;
    color: #333333;
    vertical-align: top;
    }
    .nivo-controlNav a.active, .nivo-controlNav a:hover {
    text-decoration: underline;
    }

    .nivo-directionNav a {
    display: block;
    width: 16px;
    height: 27px;
    text-indent: -9999px;
    border: 0;
    position: absolute;
    top: 142px;
    }

    a.nivo-nextNav {
    background: url(images/next.png) no-repeat 0% 0%;
    right: 786px;
    }

    a.nivo-prevNav {
    background: url(images/prev.png) no-repeat 0% 0%;
    left: 1288px;
    }

    .nivo-directionNav a:hover {
    background-position: 0% -27px;
    }

    #slider .nivo-controlNav img {
    display:inline; /* Unhide the thumbnails */
    position:relative;
    margin-right:10px;
    width:120px;
    height:auto;
    }

    As I say, I've tried every fix I can find and tried working with the margins but to no avail. Hope support can help me fix this.

  2. craig parker
    Member
    Posted 1 year ago #

    sorted

Topic Closed

This topic has been closed to new replies.

About this Topic