Okay
  Public Ticket #2485652
Portfolio page featured image alignment on mobile
Closed

Comments

  •  54
    Coastdesign started the conversation

    Hi Tahir

    When viewing the portfolio/projects page on mobile the margin is wider on the left than the right. Is there something that I have done wrong or a fix?

    Thanks

  •  3,017
    Andrew replied

    Hi there,

    Use the following custom css in Salient > General settings > CSS/Script related:

    @media only screen and (max-width: 1000px){
        body.page-template.page-template-template-portfolio .container, .post-area.standard-minimal.full-width-content .post .inner-wrap {
        margin: inherit;
    }
    }
    

    Thanks.

  •  54
    Coastdesign replied

    Hi Andrew

    The code you provided doesn't seem to still centre properly. Is there another fix?

    Thanks

  •  8,987
    Tahir replied

    Remove the CSS provided earlier and use below.

    Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):

    @media only screen and (max-width: 690px) {
        body .portfolio-items[data-gutter="15px"][data-col-num="elastic"].fullwidth-constrained, body .portfolio-items[data-gutter="15px"]:not([data-col-num="elastic"]), body .portfolio-items[data-gutter="default"]:not([data-col-num="elastic"]) {
            margin-left: -15px !important;
            margin-top: -15px !important;
        }
    }

    Thanks


    ThemeNectar Support Team 

  •  54
    Coastdesign replied

    Thanks Tahir. The updated CSS works much better.