Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS change slider size

  • This topic is empty.
Viewing 1 post (of 1 total)
  • Author
    Posts
  • #42607
    syeuddd
    Member

    Hi folks I’m new to dynamic forums…

    I need some help in decreasing the slider image size , I’m using the oxygen word press theme, the objective of decreasing size this to create additional widget space right next to slider for advertisement.. I tried messing up with style.css but the whole slider moves to the left it needs to be in center and also there is image gallery below the slider it want its size to remain the way it is .. but when I decreased the size of the slider gallery size has also been reduced

    Please help..

    below is the css code for slider from theme style.css file

    /* Featured Content (slider)


    */
    .featured-wrapper {
    float: right;
    margin-bottom: 30px;
    width: 53.19148936%; /* 750 / 940 = 0.79787234042553 */
    overflow: hidden;
    position: relative;
    z-index: 1;
    }
    #featured-content {
    position: relative;
    margin-bottom: 20px;
    }
    .featured-post {
    position: relative;
    overflow: hidden;
    float: left;
    }
    .featured-post h2.entry-title a {
    position: absolute;
    bottom: 110px;
    right: 0;
    color: #111;
    background: #fff;
    padding: .4em 30px .4em 1.5em;
    font-size: 1em;
    text-transform: uppercase;
    }
    .featured-post:hover h2.entry-title a, .featured-post:hover .byline {
    color: #fff;
    background: #111;
    }
    .featured-post .byline {
    position: absolute;
    bottom: 82px;
    right: 0;
    color: #999;
    background: #fff;
    padding: .4em 30px .4em 1.3em;
    font-size: 0.9166666666666667em;
    }
    .featured-post a:hover { border-bottom: none; }
    .featured-thumbnail { max-width: 100%; }
    #featured-content .dummy {
    width: 100% !important;
    height: auto !important;
    max-width: 100%;
    height: auto;
    }
    .no-js #featured-content .dummy, #featured-content .dummy.hidden { display: none; }
    .slider-nav {
    display: block;
    position: absolute;
    bottom: 0;
    width: 31px;
    height: 28px;
    background: #111 url(images/slider-nav-arrows.png) no-repeat;
    background: rgba(0,0,0,.5) url(images/slider-nav-arrows.png) no-repeat;
    color: #fff;
    font-size: 1em;
    z-index: 9;
    cursor: pointer;
    text-indent: -9999em;
    }
    #slider-prev {
    left: 0;
    background-position: 7px -21px;
    }
    #slider-next {
    right: 0;
    background-position: 7px 11px;
    }
    .slider-nav:hover { background-color: #000; }

    /* Featured Content (slider) Navigation


    */
    #slider-nav {
    position: relative;
    width: 100%;
    overflow: hidden;
    padding: 0;
    margin: 0;
    }
    #slide-thumbs {
    width: 100%;
    margin: 0;
    }
    #slider-nav li {
    float: left;
    list-style: none;
    width: 14.66666666666667%; /* 110 / 750 = 0.1466666666666667 */
    margin: 0 2.4% 0 0px; /* 18 / 750 = 0.024 */
    }
    #slider-nav li a, #slider-nav li a:visited {
    border-bottom: none;
    padding: 0;
    }
    #slider-nav li.last { margin-right: 0; }
    #slider-nav li img { max-width: 100%; }
    .activeSlide img { opacity: .3; }

    /* Home


    */
    .section-title {
    float: left;
    width: 93.85%;
    color: #999;
    background: #f3f3f3;
    padding: .25em .6em .35em .6em;
    margin-bottom: 20px;
    text-transform: lowercase;
    border-left: 10px solid #e9e9e9;
    }
    .hfeed-more {
    float: left;
    width: 100%;
    }
    .page-template-front .hfeed-more .hentry {
    float: left;
    width: 47.87234042553191%; /* 225 / 470 = 0.4787234042553191 */
    margin: 0 4.25531914893617% 15px 0; /* 20 / 470 = 0.0425531914893617 */
    padding-bottom: 8px;
    border-bottom: 1px solid #eee;
    }
    .page-template-front .hfeed-more .hentry.even { margin-right: 0; }
    .page-template-front .hfeed-more .hentry .entry-title a {
    font-family: ‘Helvetica Neue’, Helvetica, Arial, sans-serif;
    font-size: 0.9375em; /* 15 /16 = 0.875 */
    text-transform: none;
    color: #333;
    }
    .page-template-front .hfeed-more .hentry .entry-title a:hover {
    color: #0da4d3;
    border-color: #888;
    }

Viewing 1 post (of 1 total)
  • The forum ‘CSS’ is closed to new topics and replies.