Okay
  Public Ticket #2895480
Align columns
Closed

Comments

  •  2
    Luis started the conversation

    For example in the footer area I have my social media icons, it pc the icon display pretty good but in mobile it display all element vertically, any way to maintain this alligment horizontal?

  •  8,939
    Tahir replied

    Hey Again,

    Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):

    @media only screen and (max-width: 690px) {
        .nectar-global-section.before-footer .wpb_column:not([class*="vc_col-xs"]) .child_column {
            width: 25% !important;
        }
    }

    Thanks


    ThemeNectar Support Team 

  •  2
    Luis replied

    Thanks, add the custom css, but I wanted to learnt how because there many other parts in the webpage I want to apply the same rule

  •  2
    Luis replied

    Here for example: http://35.203.93.87


  •  8,939
    Tahir replied

    Hey Again,

    The CSS provided was a quick fix, if you wish to alter the mobile layout then you would have to adjust the Column Width on the Mobile Viewport here: http://themenectar.com/docs/salient/page-builder-columns/#width . 

    Thanks


    ThemeNectar Support Team 

  •  2
    Luis replied

    I tryed all of them with out success this is my currently positioning ass shown above. 

  •  8,939
    Tahir replied

    Hey Again,

    You need to adjust the Inner Column Widths as well for it to show up as needed or use the below CSS.

    Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):

    @media (min-width: 690px) {
        .vc_col-sm-6.vc_col-xs-12.wpb_column .vc_col-sm-4 {
            width: 33.33333333% !important;
        }
    }


    Thanks 


    ThemeNectar Support Team 

  •  2
    Luis replied

    I try it, but didn't work for mobil =(

  •  8,939


    ThemeNectar Support Team