Return to previous page

Creating Gaps Between in an Inner Column elements

This topic has 4 replies, 2 voices, and was last updated 11 minutes ago ago by Rose Tyler

Merin

Participant

November 25, 2024 at 07:32

https://anandk60.sg-host.com/all-departments/

On this page, elements are displayed as boxes. These are placed within an inner column. How to create gaps in between these boxes.

#425003 Copied

3 Answers
Rose Tyler

Support staff

November 25, 2024 at 10:32
Hello, Merin,

We’ve changed:
```
.active-block:hover {
    background-color: #b4e5f4;
}
.active-block{
    box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.1);
    padding-top: 20px;
    border-radius: 30px;
}
```
to https://prnt.sc/reaP4n_G8kJ7
```
.active-block .vc_column-inner > .wpb_wrapper {    
    box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.1);
    padding-top: 20px;
    border-radius: 30px;
}
.active-block .vc_column-inner:hover > .wpb_wrapper {
    background-color: #b4e5f4;
}
```
to get the next result – https://prnt.sc/OfjmCHtGaiDW

Best Regards,
8Theme’s Team
#425055 Copied
Merin

Participant

November 25, 2024 at 11:27

This is working. But we are facing an issue with height of boxes. Box height changes when their content varies in length. Please provide a solution

Files is visible for topic creator and
support staff only.

#425073 Copied
Rose Tyler

Support staff

November 25, 2024 at 11:42
Hello, Merin,

You’re welcome!

Please try to use this code:
```
.active-block .vc_column-inner > .wpb_wrapper {
    min-height: -webkit-fill-available;
}
```
Best Regards,
8Theme’s Team
#425079 Copied
Viewing 4 results - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.Log in/Sign up

Unleash your online potential

Explore our best WordPress WooCommerce Themes collection

lazy-placeholder

Niche Market 03 – Multivendor WP WooCommerce Theme

lazy-placeholder

Tea Store – WordPress WooCommerce Theme

lazy-placeholder

Kids Toys Store – WordPress WooCommerce Theme

lazy-placeholder

Corporate – WordPress Theme

lazy-placeholder

Hemp & CDB – WordPress WooCommerce Theme

lazy-placeholder

Cleaning – WordPress WooCommerce Theme

lazy-placeholder

Organic Cosmetics Store – WordPress WooCommerce Theme

lazy-placeholder

Wedding – WordPress Theme

lazy-placeholder

Landing Watch – WordPress WooCommerce Theme

lazy-placeholder

Bakery Store – WordPress WooCommerce Theme

See All Templates

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.