WordPress.org

Ready to get started?Download WordPress

Forums

WP-Backgrounds Lite
[resolved] Stretched background image on Elegant Theme (9 posts)

  1. sebast
    Member
    Posted 1 year ago #

    Hi,
    The plugin works great on local test website with TwentyTwelve theme, I installed it on another website where I use an Elegant Theme (Flexible), and the background images are non-uniform scaled, they are stretched...
    I tried to change the "ID or class of the content container/wrapper" setting, thinking the pbm could eventually be related to it, but it changed anything.
    Any idea ?
    Seba

    PS : I can't put the link to the production site now, if needed I'll install a test one elsewhere..

    http://wordpress.org/extend/plugins/wp-backgrounds-lite/

  2. InoPlugs
    Member
    Plugin Author

    Posted 1 year ago #

    Hi,
    you can try following css code - hopefully it fixes the issue:

    #supersized li img{
    width: auto !important;
    }

    If not please provide a link to your test server.

    Kind regards,
    InoPlugs

  3. sebast
    Member
    Posted 1 year ago #

    Hi,
    Sorry for the delay...

    Unfortunately the code didn't change anything.
    Here is the url of a test site with ET Flexible theme installed, as well as Backgrounds-lite plugin :
    http://kinotism.com/test02/?page_id=16
    I set another fullscreen bg on the homepage also..

    All the best,
    Seba

  4. InoPlugs
    Member
    Plugin Author

    Posted 1 year ago #

    Hi,
    I can't reproduce the issue on my pc - I tried Chrome, Firefox, IE and all browsers displayed the background image just fine: http://www.screenr.com/3GP7

    Maybe a browser extension/plugin causes the issue? I checked the theme css code and it's not interfering with the plugin.

    Kind regards,
    InoPlugs

  5. sebast
    Member
    Posted 1 year ago #

    Yes, with the browser window wide open it works perfectly indeed. But if you reduce the browser window width, let's say as if it was in portrait mode, the stretch is obvious.
    http://screenr.com/z4P7

    All the best,
    Seba

  6. InoPlugs
    Member
    Plugin Author

    Posted 1 year ago #

    Ok thanks. Try to replace following line in style.css:

    img { max-width: 100%; height: auto; width: auto; }

    with:

    img { max-width: none; height: auto; width: auto; }

    or try to add following code to style.css:

    #supersized img { max-width: none; }
  7. InoPlugs
    Member
    Plugin Author

    Posted 1 year ago #

    Ok thanks. Try to replace following line in style.css:

    img { max-width: 100%; height: auto; width: auto; }

    with:

    img { max-width: none; height: auto; width: auto; }

    or try to add following code to style.css:

    #supersized img { max-width: none !important;}
  8. sebast
    Member
    Posted 1 year ago #

    I used only this :
    #supersized img { max-width: none !important;}
    and it did the trick, thank you very much :))

    Best regards,
    Seba

  9. InoPlugs
    Member
    Plugin Author

    Posted 1 year ago #

    Great - glad it worked :)

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic