Distance between the sections

digidok

I have used a pre-built website from Be Theme and would like to reduce the spacing between sections.Also, one box should get a shadow (see photo). There I have specified "box-shadow" in the custom classes column but it is not displayed.

Link: https://my-realfood.de/

Phil

Hello,

1) Please, edit the column that contains this image, and reduce the padding placed in options of this column.

2) To add a shadow around this image, you will have to create a Custom CSS Code and a special class for it.

It should look like this:

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

digidok

The image now has a golden border. That's upside down. I would like to have a shadow around the whole column, like in my screenshot with photoshop reingebastelt. How does that work??

digidok

For my first problem, I removed all padding settings and the spacing is still exactly the same.

Phil

1) Are you sure that you modified this padding in Column item options, saved the changes, and updated the page?

Because I still see this padding in the source of the website.

Please, check if you do not have enabled some caching plugins because they may hold the settings from before an update.

2) Please use the following CSS code instead of the previous one:

.imageShadow{
-webkit-box-shadow: 0px 0px 20px 19px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 20px 19px rgba(0,0,0,0.75);
box-shadow: 0px 0px 20px 19px rgba(0,0,0,0.75);
}

To learn more about a box-shadow property, please, check the following link:

https://www.w3schools.com/cssref/css3_pr_box-shadow.asp

Also, you can check the box-shadow generator to customize it however you want:

https://www.cssmatic.com/box-shadow

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

digidok

1) I have not enabled any cacching plugins. Is it maybe possible that the preferences of the used pre build website "beecofood" influence the whole thing?

2.) In the box with the shadow I used the recommended settings and there is now a gap on the left that I did not set.

?

Phil

1) Please send us WordPress dashboard access privately thru the contact form, which is on the right side at http://themeforest.net/user/muffingroup#contact, and we will check what might be the reason.

Notice!

Please attach a link to this forum discussion.

2) Please add a ".column_attr" class to the previous CSS Code. It should look like this:

   .imageShadow .column_attr{
   -webkit-box-shadow: 30px 30px 84px 38px rgba(0,0,0,0.26);
-moz-box-shadow: 30px 30px 84px 38px rgba(0,0,0,0.26);
box-shadow: 30px 30px 84px 38px rgba(0,0,0,0.26);
   }

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

digidok

I did both. My shadow looks even crazier now, see screenshot.?

Phil

1) I have opened the options of the column that contain this image and text.

After reducing the third value (850px), I was able to descrease the height of it.

You should modify it there.

2) You have added the second CSS Code and you should have been replce it.

When you remove it, the shadow will look fine.

Best regards

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

digidok

Great, now it works. Thanks?