Layout and text

[vc_row full_width=”stretch_row” parallax=”content-moving” css=”.vc_custom_1430235361899{padding-top: 35px !important;padding-bottom: 60px !important;background-image: url(‘http://vcpreview.com/wp-content/uploads/2015/01/background_flat.png?id=23’)!important ;background-position: center;background-repeat: no-repeat;background-size:cover;}”][vc_column][vc_custom_heading text=”Row, Column Layouts and Text” font_container=”tag:h2|font_size:46|text_align:left|color:%23ffffff|line_height:1.5″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:700%20bold%20regular%3A700%3Anormal”][vc_separator align=”align_left” border_width=”3″ el_width=”50″ el_class=”separator-in-title”][vc_column_text css=”.vc_custom_1437477631561{margin-top: -15px !important;}”]Responsive WordPress pages and posts based on Bootstrap grid using row and column principles.[/vc_column_text][/vc_column][/vc_row][vc_row][vc_column][vc_custom_heading text=”Rows, Columns and Text Layout” font_container=”tag:h3|font_size:38|text_align:center|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal” css=”.vc_custom_1437477637442{padding-bottom: 15px !important;}”][vc_column_text]

Visual Composer uses Bootstrap grid principle to form responsive row and column layout that looks good on all type of devices.

[/vc_column_text][/vc_column][/vc_row][vc_row css=”.vc_custom_1422959791599{padding-bottom: 35px !important;}”][vc_column width=”1/2″][vc_custom_heading text=”First Column” font_container=”tag:h5|font_size:18|text_align:left|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This is a row with 2 equal columns and text paragraphs aligned on left and right. It is possible to drag columns to change their order which is handy in case you have tons of elements in each column and you wish to swap them.

[/vc_column_text][/vc_column][vc_column width=”1/2″][vc_custom_heading text=”Second Column” font_container=”tag:h5|font_size:18|text_align:right|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This is a row with 2 equal columns and text paragraphs aligned on left and right. It is possible to drag columns to change their order which is handy in case you have tons of elements in each column and you wish to swap them.

[/vc_column_text][/vc_column][/vc_row][vc_row css=”.vc_custom_1422959791599{padding-bottom: 35px !important;}”][vc_column width=”2/3″][vc_custom_heading text=”First Column” font_container=”tag:h5|font_size:18|text_align:left|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This is a row with 2 columns where left column is bigger than right column. Such layout comes in handy if you would like to create sidebar based pages.

[/vc_column_text][/vc_column][vc_column width=”1/3″][vc_custom_heading text=”Second Column” font_container=”tag:h5|font_size:18|text_align:right|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This is a row with 2 columns where left column is bigger than right column. Such layout comes in handy if you would like to create sidebar based pages.

[/vc_column_text][/vc_column][/vc_row][vc_row css=”.vc_custom_1422959791599{padding-bottom: 35px !important;}”][vc_column width=”1/3″][vc_custom_heading text=”First Column” font_container=”tag:h5|font_size:18|text_align:left|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This is a row with 3 equal columns and text paragraphs aligned on left, centre and right. Such layout comes in very handy if you want to display core features or products.

[/vc_column_text][/vc_column][vc_column width=”1/3″][vc_custom_heading text=”Second Column” font_container=”tag:h5|font_size:18|text_align:center|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This is a row with 3 equal columns and text paragraphs aligned on left, centre and right. Such layout comes in very handy if you want to display core features or products.

[/vc_column_text][/vc_column][vc_column width=”1/3″][vc_custom_heading text=”Third Column” font_container=”tag:h5|font_size:18|text_align:right|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This is a row with 3 equal columns and text paragraphs aligned on left, centre and right. Such layout comes in very handy if you want to display core features or products.

[/vc_column_text][/vc_column][/vc_row][vc_row css=”.vc_custom_1422959791599{padding-bottom: 35px !important;}”][vc_column width=”1/6″][vc_custom_heading text=”First Column” font_container=”tag:h5|font_size:18|text_align:left|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This is a row with 6 equal columns which is a perfect solution for displaying grid of features.

[/vc_column_text][/vc_column][vc_column width=”1/6″][vc_custom_heading text=”Second Column” font_container=”tag:h5|font_size:18|text_align:center|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This is a row with 6 equal columns which is a perfect solution for displaying grid of features.

[/vc_column_text][/vc_column][vc_column width=”1/6″][vc_custom_heading text=”Third Column” font_container=”tag:h5|font_size:18|text_align:center|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This is a row with 6 equal columns which is a perfect solution for displaying grid of features.

[/vc_column_text][/vc_column][vc_column width=”1/6″][vc_custom_heading text=”Fourth Column” font_container=”tag:h5|font_size:18|text_align:center|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This is a row with 6 equal columns which is a perfect solution for displaying grid of features.

[/vc_column_text][/vc_column][vc_column width=”1/6″][vc_custom_heading text=”Fifth Column” font_container=”tag:h5|font_size:18|text_align:center|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This is a row with 6 equal columns which is a perfect solution for displaying grid of features.

[/vc_column_text][/vc_column][vc_column width=”1/6″][vc_custom_heading text=”Sixth Column” font_container=”tag:h5|font_size:18|text_align:right|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This is a row with 6 equal columns which is a perfect solution for displaying grid of features.

[/vc_column_text][/vc_column][/vc_row][vc_row full_width=”stretch_row_content_no_spaces”][vc_column][vc_separator][/vc_column][/vc_row][vc_row][vc_column][vc_custom_heading text=”Row and Column Styling” font_container=”tag:h3|font_size:38|text_align:center|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal” css=”.vc_custom_1437477644576{padding-bottom: 15px !important;}”][vc_column_text]

Style rows and columns by adding background, background color, border, margin and paddings via Design Options settings. Choose from available border styles and background image positions.

[/vc_column_text][/vc_column][/vc_row][vc_row css=”.vc_custom_1423056729606{margin-bottom: 35px !important;border-top-width: 1px !important;border-right-width: 1px !important;border-bottom-width: 1px !important;border-left-width: 1px !important;padding-bottom: 10px !important;background-color: #f7f7f7 !important;border-left-color: #bababa !important;border-left-style: dotted !important;border-right-color: #bababa !important;border-right-style: dotted !important;border-top-color: #bababa !important;border-top-style: dotted !important;border-bottom-color: #bababa !important;border-bottom-style: dotted !important;}”][vc_column width=”1/2″][vc_custom_heading text=”First Column” font_container=”tag:h5|font_size:18|text_align:left|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This row has been styled with background color and dotted border. Columns are not styled in this example.

[/vc_column_text][/vc_column][vc_column width=”1/2″][vc_custom_heading text=”Second Column” font_container=”tag:h5|font_size:18|text_align:right|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This row has been styled with background color and dotted border. Columns are not styled in this example.

[/vc_column_text][/vc_column][/vc_row][vc_row css=”.vc_custom_1423056439945{padding-bottom: 35px !important;}”][vc_column width=”1/2″ css=”.vc_custom_1423058748145{border-top-width: 1px !important;border-right-width: 1px !important;border-bottom-width: 1px !important;border-left-width: 1px !important;padding-top: 15px !important;padding-right: 15px !important;padding-bottom: 15px !important;padding-left: 15px !important;background-color: #f7f7f7 !important;border-left-color: #bababa !important;border-left-style: solid !important;border-right-color: #bababa !important;border-right-style: solid !important;border-top-color: #bababa !important;border-top-style: solid !important;border-bottom-color: #bababa !important;border-bottom-style: solid !important;}”][vc_custom_heading text=”First Column” font_container=”tag:h5|font_size:18|text_align:left|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

There are 2 columns in this row and each of them has been styled separately from other. It is also allowed to combine row and column styling to create truly unique design.

[/vc_column_text][/vc_column][vc_column width=”1/2″ css=”.vc_custom_1423058737165{border-top-width: 1px !important;border-right-width: 1px !important;border-bottom-width: 1px !important;border-left-width: 1px !important;padding-top: 15px !important;padding-right: 15px !important;padding-bottom: 15px !important;padding-left: 15px !important;background-color: #f7f7f7 !important;border-left-color: #bababa !important;border-left-style: solid !important;border-right-color: #bababa !important;border-right-style: solid !important;border-top-color: #bababa !important;border-top-style: solid !important;border-bottom-color: #bababa !important;border-bottom-style: solid !important;}”][vc_custom_heading text=”Second Column” font_container=”tag:h5|font_size:18|text_align:right|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

There are 2 columns in this row and each of them has been styled separately from other. It is also allowed to combine row and column styling to create truly unique design.

[/vc_column_text][/vc_column][/vc_row][vc_row full_width=”stretch_row_content_no_spaces”][vc_column][vc_separator][/vc_column][/vc_row][vc_row][vc_column][vc_custom_heading text=”Full Width Rows” font_container=”tag:h3|font_size:38|text_align:center|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal” css=”.vc_custom_1437477651123{padding-bottom: 15px !important;}”][vc_column_text]

Full width sections based on row principle with content control. Set content to be fixed or full width together with row background.

[/vc_column_text][/vc_column][/vc_row][vc_row full_width=”stretch_row” css=”.vc_custom_1423057236863{padding-top: 35px !important;padding-bottom: 35px !important;background-color: #f7f7f7 !important;}”][vc_column width=”1/2″][vc_custom_heading text=”First Column” font_container=”tag:h5|font_size:18|text_align:left|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This row is stretched, but the columns are still fixed. Such layouts come in handy if you would like to use background color or image in full width, but at the same time leave text centred.

[/vc_column_text][/vc_column][vc_column width=”1/2″][vc_custom_heading text=”Second Column” font_container=”tag:h5|font_size:18|text_align:right|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This row is stretched, but the columns are still fixed. Such layouts come in handy if you would like to use background color or image in full width, but at the same time leave text centred.

[/vc_column_text][/vc_column][/vc_row][vc_row full_width=”stretch_row_content” css=”.vc_custom_1423057310324{padding-top: 35px !important;padding-bottom: 35px !important;background-color: #f7f7f7 !important;}”][vc_column width=”1/2″][vc_custom_heading text=”First Column” font_container=”tag:h5|font_size:18|text_align:left|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This is stretched row with stretched content. By default there is 15 pixels padding on the left and right side of the row, but it can be easily removed by choosing “Stretch row and content without spaces”.

[/vc_column_text][/vc_column][vc_column width=”1/2″][vc_custom_heading text=”Second Column” font_container=”tag:h5|font_size:18|text_align:right|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This is stretched row with stretched content. By default there is 15 pixels padding on the left and right side of the row, but it can be easily removed by choosing “Stretch row and content without spaces”.

[/vc_column_text][/vc_column][/vc_row][vc_row full_width=”stretch_row_content_no_spaces”][vc_column][vc_separator][/vc_column][/vc_row][vc_row][vc_column][vc_custom_heading text=”Responsive Rows and Columns” font_container=”tag:h3|font_size:38|text_align:center|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal” css=”.vc_custom_1437477660482{padding-bottom: 15px !important;}”][vc_column_text]

All rows and columns are fully responsive meaning your WordPress site is mobile friendly. With easy to use responsiveness tool you can control how your columns behave on different type of devices or even hide them.

[/vc_column_text][/vc_column][/vc_row][vc_row css=”.vc_custom_1422959791599{padding-bottom: 35px !important;}”][vc_column offset=”vc_col-lg-6 vc_col-md-6 vc_col-xs-12″][vc_custom_heading text=”First Responsive Column” font_container=”tag:h5|font_size:18|text_align:left|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This is a row with 2 equal columns, but if you will view this layout on the mobile screen size you will see only one column, because second column is disabled on the mobile view. In addition – visible column size will take all available space.

[/vc_column_text][/vc_column][vc_column width=”1/2″ offset=”vc_hidden-sm vc_hidden-xs”][vc_custom_heading text=”Second Responsive Column” font_container=”tag:h5|font_size:18|text_align:right|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This is a row with 2 equal columns and text paragraphs aligned on left and right. It is possible to drag columns to change their order which is handy in case you have tons of elements in each column and you wish to swap them.

[/vc_column_text][/vc_column][/vc_row][vc_row full_width=”stretch_row_content_no_spaces”][vc_column][vc_separator][/vc_column][/vc_row][vc_row][vc_column][vc_custom_heading text=”Multiline Rows” font_container=”tag:h3|font_size:38|text_align:center|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal” css=”.vc_custom_1437477671777{padding-bottom: 15px !important;}”][vc_column_text]

Even Bootstrap is limited to 12/12 column principles by default Visual Composer allows creating layouts which exceeds it by placing columns into several lines within one row.

[/vc_column_text][/vc_column][/vc_row][vc_row css=”.vc_custom_1422959791599{padding-bottom: 35px !important;}”][vc_column width=”1/2″][vc_custom_heading text=”First Column” font_container=”tag:h5|font_size:18|text_align:left|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This row contains 3 columns – while first 2 columns are displayed in one line third column is placed in the next line.

[/vc_column_text][/vc_column][vc_column width=”1/2″][vc_custom_heading text=”Second Column” font_container=”tag:h5|font_size:18|text_align:right|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This row contains 3 columns – while first 2 columns are displayed in one line third column is placed in the next line.

[/vc_column_text][/vc_column][vc_column][vc_custom_heading text=”Third Column” font_container=”tag:h5|font_size:18|text_align:center|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This row contains 3 columns – while first 2 columns are displayed in one line third column is placed in the next line.

[/vc_column_text][/vc_column][/vc_row][vc_row full_width=”stretch_row” parallax=”content-moving-fade” parallax_image=”23″ css=”.vc_custom_1435763671423{margin-bottom: 0px !important;padding-top: 35px !important;padding-bottom: 45px !important;}”][vc_column][vc_custom_heading text=”Parallax Row with Background” font_container=”tag:h3|font_size:38|text_align:center|color:%23ffffff|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal” css=”.vc_custom_1437477677558{padding-bottom: 15px !important;}”][vc_column_text]

Parallax rows with background allows creating trendy website layouts with parallax effect in order to drag your customer attention and ensure your site if following latest design standards. Combination of Parallax effect and Design Options allows create advanced parallax with more than one background level.

[/vc_column_text][/vc_column][/vc_row][vc_row full_width=”stretch_row” video_bg=”yes” video_bg_parallax=”content-moving” css=”.vc_custom_1435763664790{margin-bottom: 0px !important;padding-top: 135px !important;padding-bottom: 145px !important;}”][vc_column][vc_custom_heading text=”Video Background With Parallax Row” font_container=”tag:h3|font_size:38|text_align:center|color:%23ffffff|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal” css=”.vc_custom_1437477684828{padding-bottom: 15px !important;}”][vc_column_text]

Beautiful video background effects for your row allows dragging visitors attention with the help of YouTube videos. Option to combine video background with Parallax effect allows creating award winning sites.

[/vc_column_text][/vc_column][/vc_row][vc_row full_width=”stretch_row” full_height=”yes” parallax=”content-moving” parallax_image=”23″][vc_column][vc_custom_heading text=”Full Height Row” font_container=”tag:h3|font_size:38|text_align:center|color:%23ffffff|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal” css=”.vc_custom_1437477691161{padding-bottom: 15px !important;}”][vc_column_text]

Full height section rows is a perfect layout for creating One Page WordPress sites and Landing Pages. Full height is a good solution whenever you want to display Call to Action type block and focus your potential customer attention on specific details.

[/vc_column_text][vc_btn title=”Launch My Demo Site” style=”flat” color=”juicy-pink” size=”lg” align=”center” link=”||” el_class=”vcd_start”][/vc_column][/vc_row][vc_row][vc_column][vc_custom_heading text=”Inner Row and Column” font_container=”tag:h3|font_size:38|text_align:center|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal” css=”.vc_custom_1437477697742{padding-bottom: 15px !important;}”][vc_column_text]

In order to create advanced layouts Visual Composer introduces Inner Row and Columns element which means you can insert row into row. Inners rows and columns can be styled the same way as regular row and column by applying Design Options tool.

[/vc_column_text][/vc_column][/vc_row][vc_row css=”.vc_custom_1423059422056{padding-bottom: 35px !important;background-color: #f7f7f7 !important;}”][vc_column width=”1/2″][vc_custom_heading text=”First Column” font_container=”tag:h5|font_size:18|text_align:left|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This is a regular row with 2 equal columns with exception that left column contains inner row element.

[/vc_column_text][vc_row_inner css=”.vc_custom_1423060092997{margin-top: 5px !important;margin-right: 5px !important;margin-bottom: 5px !important;margin-left: 5px !important;padding-bottom: 15px !important;background-color: #ededed !important;}”][vc_column_inner][vc_custom_heading text=”Inner Row” font_container=”tag:h5|font_size:18|text_align:left|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This content is placed in inner row for even more advanced styling.

[/vc_column_text][/vc_column_inner][/vc_row_inner][/vc_column][vc_column width=”1/2″][vc_custom_heading text=”Second Column” font_container=”tag:h5|font_size:18|text_align:right|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This is a regular row with 2 equal columns with exception that both of the columns contain inner row element.

[/vc_column_text][vc_row_inner css=”.vc_custom_1423060101952{margin-top: 5px !important;margin-right: 5px !important;margin-bottom: 5px !important;margin-left: 5px !important;padding-bottom: 15px !important;background-color: #ededed !important;}”][vc_column_inner][vc_custom_heading text=”Inner Row” font_container=”tag:h5|font_size:18|text_align:right|color:%233a3a3a|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text]

This content is placed in inner row for even more advanced styling.

[/vc_column_text][/vc_column_inner][/vc_row_inner][/vc_column][/vc_row][vc_row full_width=”stretch_row” parallax=”content-moving” css=”.vc_custom_1430230577382{margin-bottom: -1px !important;padding-top: 35px !important;padding-bottom: 45px !important;background-image: url(http://vcpreview.com/80e7cd25e63ecf743e404978/wp-content/uploads/sites/23273/2015/01/background_flat.png?id=23) !important;background-position: center;background-repeat: no-repeat;background-size:cover;}”][vc_column][vc_custom_heading text=”Want Some More?” font_container=”tag:h4|font_size:38|text_align:center|color:%23ffffff|line_height:1.2″ google_fonts=”font_family:Lato%3A100%2C100italic%2C300%2C300italic%2Cregular%2Citalic%2C700%2C700italic%2C900%2C900italic|font_style:400%20regular%3A400%3Anormal”][vc_column_text css=”.vc_custom_1430235385941{margin-bottom: 15px !important;}”]

Why don’t you test it yourself? You are only one click away from your personal demo which allow you to access of the elements and see how easy it is to work with Visual Composer Page Builder for WordPress.

[/vc_column_text][vc_btn title=”Launch My Demo Site” style=”flat” color=”juicy-pink” size=”lg” align=”center” link=”||” el_class=”vcd_start”][/vc_column][/vc_row]