Newbie needs advice to code CSS for header

Hello,
I am completely new at coding with CSS. I use Rise Theme and Thrive Architect.
In the Style & Layout Settings, there is a box where to put some custom CSS and I can see it is very efficient as I could input some easy code and see the result of it immediately. :wink:
I would like to know a few more codes to play with in order to customize further the header.
1/ How can I shift the header down (in order to have the background color appearing on the very top of the page)?
2/ How can I create 3 horizontal strips (of different size and colors) in the header? (one of the strips will include the menu)
3/ How can I highlight the active menu item (the item corresponding to the page the visitor is located) by creating a shadow effect?
Any help would be much appreciated.
Thank you very much.
Have a nice day!

Can you share your demo via codepen?

Sorry I don’t know how to do.

css-tricks.com is a great resource.
Also, try https://www.w3schools.com/Css/css_navbar.asp for an overview of a CSS navbar.

Are you referring to the use of CSS in Wordpress @Polixe? Sorry, the post just doesn’t seem completely clear to me.

If you want to understand how to build/style a header with CSS, I would recommended searching those keywords in YouTube and find a video/teacher you like (build a css header for example.) Otherwise @zNematoadz linked some excellent resources :slight_smile:

Hello,
Kyle, yes it is about Wordpress. I use Thrive Themes products and particularly Rise Theme.
It is a great product but the header is not customizable the way I want it.
I will definitely check the resources linked by zNematoadz
Thank you all for your help :slight_smile:

Search for: position relative and absolute; left, width, height and top.
For the first question.

For question 3: search for “box-shadow” and “rgba”.