Home / Forums / You Theme Support / Column gap option does not appear

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts

  • jordipalou
    Participant

    Hi,

    I’ve been searching for the Column gap option in the row settings that “Set gap between columns, all columns within row will be affected by this value.” according to the Visual Composer Tutorial. In The Slack Community someone asked the same question 6 months ago:

    Hi there, I have question: I’m trying to set the gap between two columns in a row, but in the row settings I have no option to set this. I’ve read the HowTo in knowledge base of VC where such an option is described… Does anyone know, what kind of failure I’ve made? May this happen because we have purchased VC through the theme?

    The answer of the team support was:

    make sure you have the latest version, maybe you have outdated version of the plugin. Also, it could be so that your theme author disabled it for some reason, in such case you will need to talk to him

    My You theme version is 1.5.1 with Visual Composer 5.1.1 included.

    I want to have a row with 4 identical columns with its own background colour being separated by a gap.
    Looking for a workaround I’ve been playing to adjust margin and padding in each column but I do not get a separation for all of them.

    Hi @jordipalou

    Yes, the column gap option is disabled on YOU or any of our themes. However, spacing between column can be easily added via Custom CSS.

    If you can specify the URL of the page where you want the spacing applied, we can give you the exact CSS needed.

    Regards,


    jordipalou
    Participant
    This reply has been marked as private.

    jordipalou
    Participant
    This reply has been marked as private.

    Hi @jordipalou

    To increase the column gap between the grid on the Tecnologias row, copy and paste this CSS into Theme Options > Custom CSS

    .vc_section.tecnologias-grid .vc_col-sm-3 {
        width: 23%;
        margin-right: 15px;
    }

    If you want to decrease the gap between rows, edit each specific row and add “no-margin-bottom” as the “Extra Class Name”. If you are specifically referring the rows on Tecnologias, use this CSS:

    .vc_section.tecnologias-grid .wpb_row.row{
    padding-bottom: 0px;
    }

    Regards,


    jordipalou
    Participant
    This reply has been marked as private.

    jordipalou
    Participant
    This reply has been marked as private.

    Hi @jordipalou

    We have documentation for the theme but it does not really tackle on how to use Visual Composer since the custom class name is a feature for Visual Composer and not the theme.

    To negate the style on mobile, copy and paste this CSS into Theme Options > Custom CSS > MOBILE CSS

    .vc_section.tecnologias-grid .vc_col-sm-3 {
        width: 100%;
        margin-bottom: 15px;
        margin-right: 0px;
    }

    Regards,


    jordipalou
    Participant

    Thank you Edcel,

    It works fine!

    Regards,

    You’re welcome, @jordipalou

    Please don’t hesitate to contact us back if you encounter any issues.

    Regards,

Viewing 10 posts - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.