Some style queastions

Shapely
1

Hi there,

great theme!
I have some questions:

  1. How can i reduce the space between the widgets?
    -> http://www.kajovisuals.com at this page for example the space is much smaller than your demo-page.

  2. How can i get a space between the right/left side of the page and the pictures of portfolio widget? Also like this: http://www.kajovisuals.com

  3. How can i reduce the space between title and top/bottom of the grey title-box?
    -> like this: http://www.kajovisuals.com/portfolio/

Thank you very much!

2

Hi @daduda,

I hope you are well today and thank you for your questions.

1. How can i reduce the space between the widgets? -> http://www.kajovisuals.com at this page for example the space is much smaller than your demo-page.

You can try reducing that space by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Customize -> Shapely Options -> Other

.shapely_home_parallax section {
    padding: 46px 0;
}
2. How can i get a space between the right/left side of the page and the pictures of portfolio widget? Also like this: http://www.kajovisuals.com

I am not sure what you meant so please describe it a bit more in detail.

3. How can i reduce the space between title and top/bottom of the grey title-box? -> like this: http://www.kajovisuals.com/portfolio/

You can use the CSS solution shared in the following topic to achieve this.

https://colorlibsupport.com/t/reduce-gap-between-portfolio-and-title/

Best Regards,
Movin

3

Hi Movin,

thanks for your answer.

Point 2:

I meant a gap between the right/left side of the page and the portfolio pictures (Home-Page).
If i change in the style.css the portfolio part to MARGIN 5px there is a gap between the portfolio pictures, but i would like to get a gap between the left side and the first picture and a gap between the last picture and the right side as well, you understand?

/!---------- 20. PORTOFLIO ----------/

.project {
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
opacity: 1;
padding: 0;
}
.project .image-tile {
margin: 0px;
}

Point 3:

works, thanks. How can i get the same with the portfolio-frontpage-widget (HOME)?

THX.

4
Point 2:

I meant a gap between the right/left side of the page and the portfolio pictures (Home-Page).
If i change in the style.css the portfolio part to MARGIN 5px there is a gap between the portfolio pictures, but i would like to get a gap between the left side and the first picture and a gap between the last picture and the right side as well, you understand?

You can use the below CSS code to add those spaces.

.shapely_home_portfolio .row.masonry {
    padding: 0 8px 0 22px;
}

To help us keep support thread separates could you please create new thread for your other questions here Shapely - Colorlib Support Forum instead of asking them in your single thread as it makes the thread messy and hard to read.

If you want to you can also add reference of this thread in your newly created thread.

We would be more than happy to help you on your new thread.

5

Hi Movin,

thx - it works.
But the space between the pictures is too big - how can i reduce the space?
I already changed the padding in /!———- 20. PORTOFLIO ———-/ part from 5 to 1 but nothing happend.
Could you help? I would like to get the same result like http://www.kajovisuals.com/

Thx so much!

6

You are most welcome here :slight_smile:

As said previously to help us keep support thread separates could you please create new thread for your other questions here https://colorlibsupport.com/c/shapely/ instead of asking them in your single thread as it makes the thread messy and hard to read.

If you want to you can also add reference of this thread in your newly created thread.

We would be more than happy to help you on your new thread.