Pizza Landing Page - looking for your feedback

Hi!

Here is my third project:

Looking for your feedback and any suggestions how it’s possible to make the page look better or rewrite the code in a slicker way. Also, I have an issue with the design - I’d like that the header didn’t cover the main section(in the middle) of the website but it seems like there is an issue with my grid layout but I don’t know where it is. Therefore, I’m looking for your help with this matter as well, thank you!

1 Like

Very good project @Dmitriifs! I like the overall design and layout.

The reason the header is overlapping the content is because of the position: fixed; given to the header. When you give position: fixed; , other elements ignore that there is an element like this and they just suck in that empty space. So, you may need to fix it by setting a top margin for the content until it’s visible.

Also, try adding html {scroll-behavior: smooth; } to your CSS code and notice the cool smooth scrolling effect that appears when you click on the links at the top.

Anyway, very good and it meets the quality. The background image is also very good and undisturbing.

Happy Coding!

1 Like

Thank you! I’d tried to change the margin of the content but it didn’t work…It’s turned out that I just declared the margin the second time and didn’t notice it. It works and looks exactly how I wanted now.

I’ve modified the scrolling and I like it :+1:

1 Like

Hi, @Dmitriifs. One more thing I noticed is that when it is viewed on mobile, the first & second image in the header starts from the next line. You might want to hide that second logo. Also, the content’s width is so much less that it’s hard to read on mobile.

1 Like

Code aside, I think you may be reconsidering about colors, and borders!