FCC5 - Personal Portfolio - Feedback

Code Feedback
1

Hey,

I have completed the fifth project under Responsive Web Design. I request you to review the project and give me some feedback.

Here is the link below
https://codepen.io/Adi188288/full/vqadVz

Thanks

2

Looks nice!
filler text

1 Like
3

Thank you so much for your review @tlc35us.

4

Hello there! I watched your projects, you are doing great. Have a tip for you about your ZAP project. When i click link in nav bar it jumps little lower than needed cause of fixed header. To make it jump correctly use this http://nicolasgallagher.com/jump-links-and-viewport-positioning/ . I had same problem with my product landind page and was searching for the solution. Today i foun it and Hope it will be helpful for you too. Good luck man.

1 Like
5

About portfolio page i can say when i click on an each project in “works” part it all goes to your profile in codepen.io . Maybe will be better if you click on project image it goes on corresponding project page.

1 Like
6

Thank you @fomenkogregory for your suggestion and the link. I will definitely take a look into it.

Update

I have updated the site. Now on clicking the links present on the nav bar, the section heading is visible to the user.

Thank you:)

7

Sure. I actually kept it as a placeholder link. I had planned to change it later. I forget. I will update it soon. Thank you.

8

Hey @fomenkogregory

From the code below I understood that there will a 20px space in between my header and the content which above the header. By the way, the code works properly.

#target:before {
   content: "";
   display: block;
   height: 50px;
   margin: -30px 0 0;
}

FCC1
FCC11366Ă—768 147 KB

Please refer a screenshot above. I have added background color and border for the before pseudo selector just to understand how it works.

But my doubt is that on adding -50px of the negative margin. The before pseudo selector is pushed on top and has no spacing in between. But on selecting the nav links. It works as expected. I am just confused as there is no space but still the code works as expected.

#target:before {
   content: "";
   display: block;
   height: 50px;
   margin: -50px 0 0;
}

Please refer this screen shot below.

FCC2
FCC21366Ă—768 168 KB

I am just curious to know how the code works properly and understand it better.

Thanks