Stuck on last challenge for portfolio project

Hi , i have spent days trying to figure out how to make my #welcome-section the same size as the viewport. but still keep getting this on #layout
2. The height of the welcome section should be equal to the height of the viewport.
AssertionError: The height of #welcome-section is not equal to the height of the viewport : expected 420 to equal 261
i changed my padding-top on the .intro section & got a pass but it didn’t work for full screen. i have also tried different @media but i think i’m missing something . love some help?

Please show us some code,
so that we can help you.

I do my portfolio project too.
You can use viewport units (vh)

Please share your codepen.
Usually you should try height set to 100vh (making sure you defined the viewport)

HI this is my codepen:

Hi This is my code pen:
i shall set height to 100vh & try it out

HI there, i used vh & managed to get a pass but it didn’t apply it to full screen, i think i missed something

I got you past the last test but you have to do some alignment fixes after this code change:

height: 100vh;
padding: 0;

And setup the viewport definition in the html settings

Top and bottom padding causes your problem. If you don’t want to change them you can only add this line for .intro selector

  box-sizing: border-box;

your awesome, thanks heaps :smile:

1 Like

thanks for the tip. went with the padding in the end, but learnt a bit more about box-sizing. :slight_smile:

1 Like