Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1338937

    Hello,

    I would like to add columns within columns to achieve the 3 side-by-side icons here: https://ibb.co/fQj7w9N

    I believe this thread addresses the same question: https://kriesi.at/support/topic/adding-columns-inside-layout-elements/

    From that thread, I clicked this link https://kriesi.at/documentation/enfold/intro-to-layout-builder/#debug-mode and added the code to my functions.php (underneath if(isset($avia_config[‘use_child_theme_functions_only’])) return; since I don’t have a child theme)

    Now I’m not sure what the next step is.

    edit* i reverted the functions.php file back, because i dont feel comfortable editing it

    Thanks,
    Ryan

    • This topic was modified 2 years, 9 months ago by Ryan.
    #1338959

    Hey Ryan,
    Thank you for the link to your page, I wouldn’t recommend forcing the nesting of columns with the Avia Layout Builder Debugger perhaps I can help you achieve this another way, currently your “icons” are images in a table and are side-by-side, what is about this setup that is not to your liking?

    Best regards,
    Mike

    #1338962

    If i can accomplish it that way, that would be awesome. I just grabbed some html from an online tool and copy/pasted it. The issue is the borders / shading on the table. Any way to get rid of that so its just 3-column content with a clear background? Thanks

    #1338969

    Hi,
    Please try this code in the General Styling ▸ Quick CSS field or in the WordPress ▸ Customize ▸ Additional CSS field:

    #main .main_color .avia_textblock td {
        border-color: transparent;
    }
    #main .main_color .avia_textblock tr,
    #main .main_color .avia_textblock table {
        background: transparent;
    }

    After applying the css, please clear your browser cache and check.

    Best regards,
    Mike

    #1338977

    Amazing! Is there a way to modify the text within the cells? I’d like to make it look more consistent with the rest of the text – larger font size & less spacing between lines.

    thanks,
    Ryan

    #1339024

    Hi,
    Glad to hear, to adjust the text try this css:

    #main .main_color .avia_textblock td .p1 {
        margin: 0;
        line-height: 20px;
        font-size: 18px;
        color: #000;
    }

    To remove the extra padding & margin from the images above to tighten it up, try this css:

    #main .main_color .avia_textblock td img {
    	margin: auto;
    	padding: 0;
    }
    #main .main_color .avia_textblock tr:nth-child(1) td {
    	padding: 0;
    }

    Please see the screenshot in the Private Content area of the expected results.
    After applying the css, please clear your browser cache and check.

    Best regards,
    Mike

    #1339086

    Worked like a charm, thank you Mike!! You can close this

    Ryan

    #1339092

    Hi,
    Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

    Best regards,
    Mike

Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Adding columns within columns’ is closed to new replies.