Okay
  Public Ticket #2436017
"Equal Height Columns" leads to wrong padding applied on mobile
Closed

Comments

  •  6
    ctekk started the conversation

    Hi, 

    having the option "Equal Height Columns" activated in a row, applies wrong padding values on mobile columns.

    .col.padding-1-percent[data-border-width*="px"] > .vc_column-inner, .col.padding-2-percent[data-border-width*="px"] > .vc_column-inner, .col.padding-3-percent[data-border-width*="px"] > .vc_column-inner, .col.padding-4-percent[data-border-width*="px"] > .vc_column-inner, .col.padding-5-percent[data-border-width*="px"] > .vc_column-inner, .col.padding-6-percent[data-border-width*="px"] > .vc_column-inner, .col.padding-7-percent[data-border-width*="px"] > .vc_column-inner{
    padding: calc(100vw * 0.09);
    }

    Why is it 9% everytime, even if padding on column is set to something else?

    If that's working as intented, I prefer the "Equal Height Columns" to have a separate option for tablet and smartphone screen sizes.

  •  8,884
    Tahir replied

    Hey Again,

    That's added to have a consistent look on Mobiles. If you wish to have different padding for Mobile/ Tablet, the CSS you referenced can be added in a media query to apply different padding to each device.

    /* for mobile */
    @media only screen and (max-width: 690px) {    .col.padding-4-percent > .vc_column-inner, .col.padding-5-percent > .vc_column-inner, .col.padding-6-percent > .vc_column-inner {        padding: calc(100vw * 0.06);    }
    }
    /* for tablets */
    @media only screen and (max-width: 1025px) {    .col.padding-4-percent > .vc_column-inner, .col.padding-5-percent > .vc_column-inner, .col.padding-6-percent > .vc_column-inner {        padding: calc(100vw * 0.09);    }
    }
    

    Thanks 


    ThemeNectar Support Team