positioning confusion
hello,
while making this landing page , i have to fix the header using fixed position property.
while doing so the elements i write after that header appears below of it also takes the place of that header (which makes sense) in normal document flow.
but to be able to make this landing page complete i have to apply paddings and margins at top .is it the right way?
11 Replies
Try
position: sticky;
instead of fixed
and you can also add top: 0
or actually, play around with the top lol
i don't remember if it has to be the height of the header or not, but i think top: 0 should do the tricki have done top 0 and width 100%
of the header
cool, so do position: sticky
sticky does the same job?
?
sticky does the same job without taking the element out of the flow of the html
this means that the elements below the header will still know that the header is there
and when you start scrolling, and you get to the amount of pixels specified in the
top
property, that's when the other stuff starts going underneath the headeroh i have only used fixed before so i didnt know this
well, we learn something new everyday :D
(hopefully lol)
top 0 and width 100% will do it ig
great 👍
thanks bro
no problem