Issues with mobile-friendly portfolio page

Hi everyone,

I am editing my portfolio website to be mobile friendly, but the project page keeps overlapping the contact page on my phone. Though it looks normal on desktop. Please advise! Thank you.

https://codepen.io/cmtran/pen/ZXPVJO

Hi)
Try to delete height css rule for your classes pageOne,pageTwo etc.And see what wiil happen.
You set strong rule for height for all devices as main rule and at small viewport devices too. Not all elements fit. That’s why they are moving onto your contact information.
Fix it by creating css rule height: auto; for your small devices.

Use links below.
Media Queries
CSS: height
CSS: Box Model
CSS: position

Nice work.

Best regards.
Feel free to ask questions.

1 Like

Thank you very much for your feedback! I’ll try it out.