Cumulative Layout Shift (CLS) in Header

Question

I am having a trouble with some Cumulative Layout Shift (CLS) appearing from the footer in the header. The social icons + the text 'discover' appears behind the main logo.

Domain is www.minoar.com

Some of the CSS here from it is:

#footerSocial {
top: 27px;
display: block;
 
#footerSocial {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
text-align: center;
padding: 5px 50px 0 50px;

However I am not sure how to fix this and make it static to the footer. I'll appreciate your advises. Thank you so much!

Answer 1

Just try

position:sticky

for your footer section. This will fix the issue.