Street Style Landing Page

Table of contents

• Overview
  • The challenge
  • Screenshot
• My process
  • Built with
  • What I learned
  • Continued development
  • Useful resources
• Author

Overview

The challenge

• Adjust the images in page layout.
• Hover effect with underline style.

Screenshot

My process

Built with

• Semantic HTML5 markup
• CSS custom properties like position , pseudo Selectors etc.
• Flexbox

What I learned

• Learn how to use position with z-index .
• Learn about the alignment of elements .
• Learn about the pseudo Selectors.

  .hero-container div img[alt="person-hero-iamge"] {
    width: 21.875rem;
    position: absolute;
    z-index: 1;
    left: 0%;
    top: 10%;
  }

Continued development

• With the css pseudo selectors and positions.

Useful resources

• Stackoverflow - This is a free platform where you find the solution of your problem or an idea related to your problem.

Author

• Kapil Kharera
• Linkedin - @kapil-kharera