Need help on my faux web page

Code Feedback
1

Hey All,

I started working on my web page. When I scroll down to the next page and select the Main button to go back to the top page, it does not scroll all the way up and stops at the top of the hello text…

I am not sure why this is happeneing… can someone please let take a look and let me know what the issue might be?

https://codepen.io/ainneo/pen/QrEVVG

2

it stops here when:

  • scroll down and hit main link at the top… I dont want go any furthur until I figure this out… any help would be great!!!

14%20PM
14%20PM722×486 15.6 KB

3

Your links are linking to the wrong thing.

Change the first link to a href="#page1" instead of #main. That will fix your issue. Then the next page 2 and so on. You were linking to the section id, you were linking to a link so it was putting the window at the position of the block level element a.

Hope that helps! Good luck!

4

Also it looks like you are trying to do full screen section, try using viewport units for desktop views. So for each section make it 100vh in height. And then utilize flex box to center the text, especially the landing page.

For ex:

display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
padding-left: 100px;

That should give you the effect you are wanting

5

see this Your project with my code

6

THAT WORKED! THANK YOU so very much!

7

Thanks again Daniel! It all worked like a charm! I am need to learn FlexBox next.

57%20PM
57%20PM1144×1306 328 KB

8

Not a problem! If you ever need help shout. Keep me posted on this project.

9

thanks so much Daniel! I will for sure!