[Resolved] responsive media problem wider than the content

Home Forums Support [Resolved] responsive media problem wider than the content

Home Forums Support responsive media problem wider than the content

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1606081
    qpaq

    Hi,

    I have a content type where I’d like to use media wider than the content area. I’ve managed to do it on desktop but it’s not as responsive as I want it. (linked below)

    I use the following code to achieve it.

    /* Set wider than content media*/
    .entry-content .alignwide .midslider, body:not(.no-sidebar) .entry-content .alignwide {
        margin-left: -140px;
        width: calc(100% + 140px);
        max-width: calc(100% + 140px);
    }
    /* End Set wider than content media */

    However, when I squeeze the page to a narrower viewport the images and slide gallery is not responsive as they should be.

    My goal is to achieve the same responsiveness of this example:
    https://www.atlasobscura.com/articles/ugly-orchid

    #1606318
    David
    Staff
    Customer Support

    Hi there,

    the simple solution here is to make the Container Blocks inner width slightly larger, eg. 140px wider, then on your Container filled with text you can add left or right padding to the same value for the Desktop mode ( you can set the padding to 0 on Tablet / Mobile if needed).

    #1606679
    qpaq

    Perfect! no need to deal with the CSS code then. Thanks a lot.

    #1607631
    David
    Staff
    Customer Support
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.