landing page using html css and a bit of js

Community feedback

• 

  Aakash Verma•6,710

  @skyv26Posted almost 3 years ago

  Hi! Vishal, I checked your code and also tested the responsiveness. I have noticed some issues in your work. All seems good in Desktop mode but in mobile view there are following issues.

  1. Your layout just cover 85% of width. As I can see ~15% screen width left white or blank. It happened because you did not used width: 100% in your body in order to cover full width.

  So add width in your body's CSS and it will always cover your layout width on all devices.

  2. Your navigation menu icon is not aligned with your logo. So do as given below:

  .header-div-1 {
      display: flex;
      justify-content: space-between;
      align-items: center;
  }
  

  just add align-items property and your header content aligned correctly.

  3. Between Graphic-design and Photography I saw a white gap which looks not good.

  4. Your mobile design is overflowing, and I can see you have 11 accessibility issues too. So do one thing. Wrap your all body's content inside main tag OR between opening and closing of main tag. and add overflow: hidden; to the main tag CSS. It will solve 2 things.

  i. It will solve overflow issue. ii. It will solve accessibility issue.

  I hope you understand above issues and soon will fix it.

  Good Luck

  Marked as helpful

  0
• 

  Vishal Kumar•210

  @LahsivK4070Posted almost 3 years ago

  Thanks Akash. Your suggestions helped me improve my work. Now i have zero accessibility issues and all the other issues you mentioned are also resolved. Thanks once again for your time in helping me.

  1

  ---

  

  Aakash Verma•6,710

  @skyv26Posted almost 3 years ago

  @LahsivK4070 your welcome

  0