How to add space between header and sidebar?

There are many tools available for this kind of CSS work, for example:
– Firefox with Firebug add-on: Help info on Firebug https://getfirebug.com/faq/
– Newer IE/Chrome, etc., have similar tools
– Alternately, try a dedicated CSS resource such as https://www.css-discuss.org/
– Also, consider creating a child theme otherwise all your customization will be overwritten when you next update your theme. Alternately, use Custom CSS Manager plugin: https://www.ads-software.com/plugins/custom-css-manager-plugin/

I think there are many ways to provide a small space between the banner and the sidebar. Maybe you can adjust the positions of either the banner or the sidebar. You can move the banner upward or the sidebar downward.

Also, you can also make the banner a little bit smaller so it can provide a little space between.

You can find these things in style.css. It’s quick and very easy plus you can learn other tricks by reading some more.

Hope I helped you.

Thank you for the suggestions, I’m eager to learn more.

However, part of my problem is that I’m using a custom theme created by a developer and the style.css file in themes folder says:

WARNING! DO NOT EDIT THIS FILE!

To make it easy to update your theme, you should not edit the styles in this file. Instead use the customizer custom css to add your styles. You have been warned! ??

Do you know where I might find the code for the theme so I can begin my learning process?

OK, with the help of a friend, I was able to figure this out. I pasted the following code into the Custom CSS and it worked:

aside.df-sidebar.df_span-sm-3 {padding-top: 40px}

For other people who have no experience (like me) with CSS, these are the things I had to learn:

Meaning of a class
Proper syntax for padding
How to use Safari Element Inspector tool and the Style tab

Took me 1.5 days to figure this out, but figure it out I finally did. This is the kind of lesson I will never forget…