Visual Composer Full Width Row w/ 4 columns Responsive (Cool Pre-footer concept)

I am having the hardest time duplicating this Full width VC Row that includes 4 inner rows with 2 columns in each that aligns my icon to the right and Txt to the left.

I need the row to have minimal padding along with a slim gray dividers for the inner columns. I just cant get it to work and stacking is a pain. please help. (photos examples attached)

Attachments:

You must be logged in to view attached files.

Hello,

Thank you so much purchasing our theme and contacting our support center.

You should be able to achieve it using WPBakery rows and columns. They have options for paddings and margins and you can control the space in such a way. Are you able to send us a link where you are trying to build it? We will take a look and try to give you some advice. Currently, we don’t know what exactly difficulties do you have there.

Kind Regards
XTemos Studio

I currently have this in VC:

[vc_row full_width=”stretch_row_content_no_spaces” equal_height=”yes” content_placement=”middle” css=”.vc_custom_1524717659073{margin-top: 0px !important;margin-bottom: 0px !important;padding-top: 0px !important;padding-bottom: 0px !important;background-color: #141414 !important;}”][vc_column width=”1/4″ css=”.vc_custom_1524717553203{border-right-width: 1px !important;padding-top: 0px !important;padding-bottom: 0px !important;border-right-color: #3d3d3d !important;}”][vc_row_inner content_placement=”middle” css=”.vc_custom_1524717358332{border-right-width: 1px !important;padding-top: 0px !important;padding-bottom: 0px !important;}”][vc_column_inner width=”1/4″][vc_icon type=”linecons” icon_linecons=”vc_li vc_li-truck” color=”white” size=”lg” align=”right”][/vc_column_inner][vc_column_inner width=”3/4″][woodmart_responsive_text_block font=”alt” size=”custom” align=”left” content_width=”80″ color_scheme=”light” desktop_text_size=”15″ tablet_text_size=”15″ mobile_text_size=”12″]FREE SHIPPING WORLDWIDE[/woodmart_responsive_text_block][/vc_column_inner][/vc_row_inner][/vc_column][vc_column width=”1/4″][vc_row_inner content_placement=”middle” css=”.vc_custom_1524717374599{border-right-width: 1px !important;padding-top: 0px !important;padding-bottom: 0px !important;}”][vc_column_inner width=”1/4″ css=”.vc_custom_1524717602450{padding-top: 0px !important;padding-bottom: 0px !important;}”][vc_icon type=”linecons” icon_linecons=”vc_li vc_li-truck” color=”white” size=”lg” align=”right” css=”.vc_custom_1524717686751{padding-top: 0px !important;padding-bottom: 0px !important;}”][/vc_column_inner][vc_column_inner width=”3/4″ css=”.vc_custom_1524717579601{padding-top: 0px !important;padding-bottom: 0px !important;}”][woodmart_responsive_text_block font=”alt” size=”custom” align=”left” content_width=”80″ color_scheme=”light” desktop_text_size=”15″ tablet_text_size=”15″ mobile_text_size=”12″]FREE SHIPPING WORLDWIDE[/woodmart_responsive_text_block][/vc_column_inner][/vc_row_inner][/vc_column][vc_column width=”1/4″ css=”.vc_custom_1524717264832{padding-top: 0px !important;padding-bottom: 0px !important;}”][vc_row_inner content_placement=”middle” css=”.vc_custom_1524717053139{border-right-width: 1px !important;}”][vc_column_inner width=”1/4″][vc_icon type=”linecons” icon_linecons=”vc_li vc_li-truck” color=”white” size=”lg” align=”right”][/vc_column_inner][vc_column_inner width=”3/4″][woodmart_responsive_text_block font=”alt” size=”custom” align=”left” content_width=”80″ color_scheme=”light” desktop_text_size=”15″ tablet_text_size=”15″ mobile_text_size=”12″]FREE SHIPPING WORLDWIDE[/woodmart_responsive_text_block][/vc_column_inner][/vc_row_inner][/vc_column][vc_column width=”1/4″ css=”.vc_custom_1524717288228{padding-top: 0px !important;padding-bottom: 0px !important;}”][vc_row_inner content_placement=”middle” css=”.vc_custom_1524717319971{border-left-width: 1px !important;padding-top: 0px !important;padding-bottom: 0px !important;border-left-color: #a5a5a5 !important;}”][vc_column_inner width=”1/4″][vc_icon type=”linecons” icon_linecons=”vc_li vc_li-truck” color=”white” size=”lg” align=”right”][/vc_column_inner][vc_column_inner width=”3/4″][woodmart_responsive_text_block font=”alt” size=”custom” align=”left” content_width=”80″ color_scheme=”light” desktop_text_size=”15″ tablet_text_size=”15″ mobile_text_size=”12″]FREE SHIPPING WORLDWIDE[/woodmart_responsive_text_block][/vc_column_inner][/vc_row_inner][/vc_column][/vc_row]

Hello,

Here below please take the ready code and now the corrections made as follows:

1/ It is necessary to enter each inner row/column/element http://prntscr.com/jac1aq and set zero in paddings/margins http://prntscr.com/jac2fe

2/ If you want to place icon and text in one row on mobile you need to configure responsiveness for columns http://prntscr.com/jac3ip you will get this result on mobile: http://prntscr.com/jac3zh they are not broken

3/ If you want a border on the right on desktop and border in the bottom on the mobile it is necessary to add two classes and give them CSS rules for each device type:
http://prntscr.com/jac4ra

4/ Here is CSS for border. Change the color and bottom padding:

@media screen and (min-width:768px){
.leftborder{
    border-right:1px solid #f9f9f9;
}
}

@media screen and (max-width:768px){
    .bottomborder{
   border-bottom:1px solid #f9f9f9!important;
    padding-bottom:20px;
}
.leftborder{
    border:none;
}
}

5/ Here is ready VC code

[vc_row full_width="stretch_row_content_no_spaces" equal_height="yes" content_placement="middle" css=".vc_custom_1524717659073{margin-top: 0px !important;margin-bottom: 0px !important;padding-top: 0px !important;padding-bottom: 0px !important;background-color: #141414 !important;}"][vc_column width="1/4" css=".vc_custom_1524717553203{border-right-width: 1px !important;padding-top: 0px !important;padding-bottom: 0px !important;border-right-color: #3d3d3d !important;}"][vc_row_inner content_placement="middle" css=".vc_custom_1524734330482{margin-top: 0px !important;margin-bottom: 0px !important;border-right-width: 1px !important;padding-top: 0px !important;padding-bottom: 0px !important;}" el_class="leftborder bottomborder"][vc_column_inner width="1/4" css=".vc_custom_1524734713610{padding-top: 0px !important;padding-bottom: 0px !important;}" offset="vc_col-xs-5"][vc_icon type="linecons" icon_linecons="vc_li vc_li-truck" color="white" size="lg" align="right" css=".vc_custom_1524734124294{margin: 0px !important;border-width: 0px !important;padding: 0px !important;}"][/vc_column_inner][vc_column_inner width="3/4" css=".vc_custom_1524734705818{padding-top: 0px !important;padding-bottom: 0px !important;}" offset="vc_col-xs-7"][woodmart_responsive_text_block font="alt" size="custom" align="left" content_width="80" color_scheme="light" desktop_text_size="15" tablet_text_size="15" mobile_text_size="12" css=".vc_custom_1524734036494{margin-top: 0px !important;margin-bottom: 0px !important;border-top-width: 0px !important;border-bottom-width: 0px !important;padding-top: 0px !important;padding-bottom: 0px !important;}"]FREE SHIPPING WORLDWIDE[/woodmart_responsive_text_block][/vc_column_inner][/vc_row_inner][/vc_column][vc_column width="1/4" css=".vc_custom_1524733228890{padding-top: 0px !important;padding-bottom: 0px !important;}"][vc_row_inner content_placement="middle" css=".vc_custom_1524734330482{margin-top: 0px !important;margin-bottom: 0px !important;border-right-width: 1px !important;padding-top: 0px !important;padding-bottom: 0px !important;}" el_class="leftborder bottomborder"][vc_column_inner width="1/4" css=".vc_custom_1524734713610{padding-top: 0px !important;padding-bottom: 0px !important;}" offset="vc_col-xs-5"][vc_icon type="linecons" icon_linecons="vc_li vc_li-truck" color="white" size="lg" align="right" css=".vc_custom_1524734124294{margin: 0px !important;border-width: 0px !important;padding: 0px !important;}"][/vc_column_inner][vc_column_inner width="3/4" css=".vc_custom_1524734705818{padding-top: 0px !important;padding-bottom: 0px !important;}" offset="vc_col-xs-7"][woodmart_responsive_text_block font="alt" size="custom" align="left" content_width="80" color_scheme="light" desktop_text_size="15" tablet_text_size="15" mobile_text_size="12" css=".vc_custom_1524734036494{margin-top: 0px !important;margin-bottom: 0px !important;border-top-width: 0px !important;border-bottom-width: 0px !important;padding-top: 0px !important;padding-bottom: 0px !important;}"]FREE SHIPPING WORLDWIDE[/woodmart_responsive_text_block][/vc_column_inner][/vc_row_inner][/vc_column][vc_column width="1/4" css=".vc_custom_1524717264832{padding-top: 0px !important;padding-bottom: 0px !important;}"][vc_row_inner content_placement="middle" css=".vc_custom_1524734330482{margin-top: 0px !important;margin-bottom: 0px !important;border-right-width: 1px !important;padding-top: 0px !important;padding-bottom: 0px !important;}" el_class="leftborder bottomborder"][vc_column_inner width="1/4" css=".vc_custom_1524734713610{padding-top: 0px !important;padding-bottom: 0px !important;}" offset="vc_col-xs-5"][vc_icon type="linecons" icon_linecons="vc_li vc_li-truck" color="white" size="lg" align="right" css=".vc_custom_1524734124294{margin: 0px !important;border-width: 0px !important;padding: 0px !important;}"][/vc_column_inner][vc_column_inner width="3/4" css=".vc_custom_1524734705818{padding-top: 0px !important;padding-bottom: 0px !important;}" offset="vc_col-xs-7"][woodmart_responsive_text_block font="alt" size="custom" align="left" content_width="80" color_scheme="light" desktop_text_size="15" tablet_text_size="15" mobile_text_size="12" css=".vc_custom_1524734036494{margin-top: 0px !important;margin-bottom: 0px !important;border-top-width: 0px !important;border-bottom-width: 0px !important;padding-top: 0px !important;padding-bottom: 0px !important;}"]FREE SHIPPING WORLDWIDE[/woodmart_responsive_text_block][/vc_column_inner][/vc_row_inner][/vc_column][vc_column width="1/4" css=".vc_custom_1524717288228{padding-top: 0px !important;padding-bottom: 0px !important;}"][vc_row_inner content_placement="middle" css=".vc_custom_1524735061800{margin-top: 0px !important;margin-bottom: 0px !important;border-right-width: 1px !important;padding-top: 0px !important;padding-bottom: 0px !important;}"][vc_column_inner width="1/4" css=".vc_custom_1524734713610{padding-top: 0px !important;padding-bottom: 0px !important;}" offset="vc_col-xs-5"][vc_icon type="linecons" icon_linecons="vc_li vc_li-truck" color="white" size="lg" align="right" css=".vc_custom_1524734124294{margin: 0px !important;border-width: 0px !important;padding: 0px !important;}"][/vc_column_inner][vc_column_inner width="3/4" css=".vc_custom_1524734705818{padding-top: 0px !important;padding-bottom: 0px !important;}" offset="vc_col-xs-7"][woodmart_responsive_text_block font="alt" size="custom" align="left" content_width="80" color_scheme="light" desktop_text_size="15" tablet_text_size="15" mobile_text_size="12" css=".vc_custom_1524734036494{margin-top: 0px !important;margin-bottom: 0px !important;border-top-width: 0px !important;border-bottom-width: 0px !important;padding-top: 0px !important;padding-bottom: 0px !important;}"]FREE SHIPPING WORLDWIDE[/woodmart_responsive_text_block][/vc_column_inner][/vc_row_inner][/vc_column][/vc_row]

Best Regars

Thank you so much!

You are welcome! If you have any questions feel free to contact us.

[Author]

Posts