WordPress.org

Support

Support » Plugins and Hacks » [Resolved] unable to span promo slider 100%

[Resolved] unable to span promo slider 100%

  • tonka_toys
    Member

    @tonka_toys

    Hi
    as per screen shot I’m unable to span the promo-slider 100% to region.

    I have tried various css coding , however I cannot get the image to span across

    the original image size is 1920 × 1200

    here is the css I have tried to use to hack the slider

    #promo-wide {
    margin-left:-64px;
    padding-left:24px;
    padding-right: 0px;
    width: 100%;
    }

    .promo_slider {
    width: 2000px; !important;
    }

    here is the code to display the slider in the header:

    </nav><!– #site-navigation –>

    <div id=”promo-wide”>
    <?php echo do_shortcode(‘[promoslider width=”100%”]’); ?>

    </div>

    </header><!– #masthead –>

    <div id=”main” class=”wrapper”>

    Please help.

    Thanks!

    http://wordpress.org/plugins/promotion-slider/

Viewing 9 replies - 1 through 9 (of 9 total)
  • tonka_toys
    Member

    @tonka_toys

    Plugin Author Micah Wood
    Participant

    @woodent

    By default, the slider should go 100% width. So you either have some margin or padding in one of the containing elements, or your image just isn’t that large.

    Screenshots and HTML markup only tell a small portion of the story. I’d be glad to look at the URL where the slider is and tell you exactly what is going wrong and how to fix it.

    tonka_toys
    Member

    @tonka_toys

    Hi. Thanks for your reply.the url is handytherapies .co.uk
    Would much appreciate if u could take a look. Regards

    Plugin Author Micah Wood
    Participant

    @woodent

    The theme you are using has left and right padding on the #page element that is set using REMs. What you want to do is this:

    Remove your existing styling from the #promo-wide element:

    #promo-wide {
        margin-left: -64px;
        padding-left: 24px;
        padding-right: 0px;
        width: 100%;
    }

    Replace with this:

    #promo-wide {
        margin-right: -2.857142857rem;
        margin-left: -2.857142857rem;
    }

    NOTE: Once you’ve done this, the slider will appear to be aligned to the left. In reality, it is not… you image is just 960px wide and not 1040px.

    tonka_toys
    Member

    @tonka_toys

    Hi. thanks for your prompt reply.
    do you know why it would be rendering the image as 960px wide instead of 1024 ? when you inspect the image URL, it’s original size is in fact 1024px wide. I cannot see any parameters to control the width

    http://www.handytherapies.co.uk/wp-content/uploads/2013/12/bg-1024×640.jpg

    I cannot see any settings on promotion slider on image dimensions.

    Unless it is wordpress resizing the image on the fly?

    <img width=”960″ height=”600″ src=”http://www.handytherapies.co.uk/wp-content/uploads/2013/12/bg-1024×640.jpg” class=”attachment-large wp-post-image” alt=”bg.jpg”>

    Plugin Author Micah Wood
    Participant

    @woodent

    Be sure that the image size in the Promotion Slider options is set to ‘full size’.

    What could be happening is that your theme is applying a filter and adjusting the image width / height so that it doesn’t extend beyond the max width of 960 that the theme design expects. That is just a theory, but I’ve seen several themes that do this type of thing.

    If you insert the same full-size image directly into a post, do the image dimensions get altered the same?

    If you switch to another theme, does the image size increase?

    bamgraphics
    Member

    @bamgraphics

    The slider has been working for me all along – Now, after months, I just uploaded a new slide and it created a gap between the promo and the slide.

    I tried a png with transparency also – the grey background also shows through. This may give a clue as to why it is happening.

    Plugin Author Micah Wood
    Participant

    @woodent

    @bamgraphics,

    Any details you can provide would help myself or others help you solve your issue. A link to the page where you are having the problem would be ideal…

    It sounds like you may just need to add a CSS rule to remove the grey background.

    bamgraphics
    Member

    @bamgraphics

    Literally just figured it out.

    Had to uncheck “Add this image to” on the “Set Featured Image” page.

    Wow – timing.

    Thanks anyway.

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘[Resolved] unable to span promo slider 100%’ is closed to new replies.