@AbNassif
Posted
1- In the Egg Image section, you can actually just add a width of 50% without a height property. These images are specifically designed to take up the spaces in the design. So giving it a width of 50%, would mean "assign the height of the image meanwhile respect the width of 50% of the image",.
2- Really loved the initiative you took with the fixed nav header, but the background should activate faster as the link text is overlapping with the main header.
3- The background of the footer is grey instead of the greenish color displayed in the design, and it's not your fault as it wasn't displayed in the "Style-Guide", but in these cases (and real-world as well), you could just use a website like "https://imagecolorpicker.com/en" to get the color displayed in the design.
4-You forgot to add a hover effect to the button in the nav using :hover in css and including a transition for it to smoothly change.
5-The nav bar is opening on it's own when the viewport get's small enough.
Remark: You should practice responsive units to reduce code, and get comfortable with flexbox and css grid offered by CSS. Learning a Css framework without mastering it first will really frustrate you and prolong the journey ( Don't ask me how I know that).
Last but not least, great job! You did quite well, don't forget to keep on practicing and hit me up if you have any questions(Would love to have a coding buddy!).
Marked as helpful
@developedBySwan
Posted
@AbNassif Thank those help me a lot. without your comment I can't know what need to learn. Thank for interesting my work and giving suggestion. see you again in another challenge buddy.