I'm creating a React component for a header, to be used in a page layout. It's going to be slightly glassy, and pinned to the top of the page. I would like there to be a gap at the top of the page so that on page load the top of the content is not hidden under the header.
I've not done this before (I've had a roughly 20 year gap in doing web stuff), so I don't know if there's a convention for doing this. Is this usually done as part of header? This appeals to me because it's then encapsulated together. Is it usually done as 2 parts - the header and a gap for the header at the top of the content area? Does the answer depend on the rest of the layout? Does the answer depend on other things that I haven't even considered? (honestly, the most likely option).
I think maybe the question is "what is it that I need to think about in order to answer this question?"