Personal Portfolio Webpage project

Link :https://codepen.io/manpreet-singh10196/pen/wZKezd
Give it a feedback please

Looks cool. This are two things I noticed:

-The nav links didn’t work for me (not sure why since the anchor tag code looks right to me). (Edit: I tried them on a PC and it worked. For mobile I was using iPhone 7plus and they didn’t work).
-The width overflowed the width of my mobile so I had to scroll horizontally to see everything at 100% zoom. Perhaps add a wrapper for everything with a 90-100% width.

1 Like

Here are some things i have noticed.

1 - The Color scheme with the green and blue text is not that good. Here is what I tried:

  • Added a box-shadow: 2px 2px 5px black; @ nav ul
  • Set the background color to white @ nav ul
  • Set color to black @ nav ul li a
  • Set font size to 20 @ nav ul li a
  • Set scroll-behavior: smooth; @ html

All of these spruce up and better your navigation bar.

2 - Add a background image to your welcome section. Then make the text bigger and a different color depending on it. Also, make your overall welcome section smaller.

3 - Look up CSS transitions and apply them to your hover and other transition classes.

4 - Do not stretch your images in your project section. I suggest that when you hover over a project, it scales outwards with a box-shadow w/ CSS transition, Example @ my certifications section: https://codepen.io/Mike-was-here123/full/zMWrwx

You have a nice start, now refine the CSS.


Notes

Please hit the reply button or I do not get notified.

Helpful tools–> https://codepen.io/Mike-was-here123/post/check-out-these-sites

1 Like

Thank you for your feedback, I get your points and apply in my page, its looks good as compare to previous.

1 Like