Need help with CSS in column layout

  • Resolved pgdev

    (@pgdev)


    6 months, 1 week ago

    Hello Everyone, I need little help in making this Image background stick to the left and responsive even when zoomed in or zoomed out. Right now, I applied CSS changes as below: 

    #event-section .event-bg1 {
    margin-left: -50px;
}

    But sticks to left upto 80% zoomed in, beyond that it doesn’t. I need that img to cover full left. Right now it looks like this:
    Click here to view

    Any idea how to achieve this, Please help.. Thanks

    The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)

  • In your CSS:

    .responsive .container{max-width: 1450px}

    If the container width exceeds 1450px, empty space will appear on the left and right. Change the CSS code to the following.

    .responsive .container{max-width: 100%}

    https://ibb.co.com/jJfrjqM

    Thread Starter pgdev

    (@pgdev)

    It workssss. Thanks very much!! Any idea on how to apply this css change for one specific page? Currently it applies for all pages.

    You can add html block in such page editor.

    <style>
.responsive .container{max-width: 100%}
</style>
    Moderator bcworkz

    (@bcworkz)

    Or use a unique body class selector:
    .page-id-9941 .responsive .container{max-width: 1450px}

    • This reply was modified 6 months, 1 week ago by bcworkz. Reason: missing dot
    Thread Starter pgdev

    (@pgdev)

    Yes @bcworkz, unique body class selector worked out. Thanks!

    Moderator bcworkz

    (@bcworkz)

    You’re welcome! I neglected to include the . dot class signifier with that, but if the added class is working for you, you obviously fixed it yourself.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Need help with CSS in column layout’ is closed to new replies.