eleven40 images inserted into page not responsive

Community Forums Forums Design Tips and Tricks eleven40 images inserted into page not responsive

This topic is: resolved

This topic contains 8 replies, has 3 voices, and was last updated by  macmonkeymark 1 year, 2 months ago.

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #43723

    benjeeno
    Participant
    Post count: 248

    I’m using eleven40 and images inserted into a page or post are not responsive; the images won’t scale down. They are larger than smartphone screensize but when screensize gets that small the images stay the fixed size set in the image editor. I’ve tried making one or both dimensions 100% and that doesn’t work. Anyone know a trick for this, for this theme?

    http://www.thepubliccourt.com/robert-oblock-certification-diploma-mill/no-forensic-background-no-problem/
    #43735

    rfmeier
    Participant
    Post count: 597

    Hello,

    From a quick element inspect I noticed the caption box surrounding the images has an inline style width, e.g. style=”width: 435px;”.  This is preventing the images from scaling.  From within Chrome I was able to remove the inline style and the image within the caption box scaled properly.

    Hope this helps.


    #43737

    benjeeno
    Participant
    Post count: 248

    Well I didn’t make any change to the any style having to do with the images or image editor. This is what the theme is doing out of the box.

    It is the Caption that is causing this because after reading your response I removed the image Caption content and now it behaves the way I want it to. But how do I keep the caption and have it scale?

    #43738

    rfmeier
    Participant
    Post count: 597

    I can take a quick look tomorrow morning and see if there is an easy fix.

     


    #43744

    benjeeno
    Participant
    Post count: 248

    Alright thanks. I’ll see what I can find or figure out too.

    #43801

    rfmeier
    Participant
    Post count: 597

    Hello,

    I took a quick look this morning.  From looking at the source code the .wp-caption elements are given an inline width of 10 + (image width), so that really cannot be changed.

    Try to css rule below.  I was able to get the wp-caption elements to scale after I modified the css.

    [css]
    .wp-caption {
    max-width: 100%;
    }[/css]

    Try that and let me know how it works out.


    #43857

    benjeeno
    Participant
    Post count: 248

    Yes Ryan that works. I had to also bring it down to max-width: 96% for @media 800px (smallscreen) because the content or wrap was overlapping the right side of the image. Not sure if that was the most appropriate value change but it works.

    Thanks so much!

    #43863

    rfmeier
    Participant
    Post count: 597

    You’re welcome.  Glad I could help.


    #47642

    macmonkeymark
    Participant
    Post count: 2

    This worked for me too. Thanks Ryan.

Viewing 9 posts - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.