catherineisonline / fylo-landing-page-with-two-column-layout-frontendmentor

This is my solution to the Fylo landing page with two column layout challenge on Frontend Mentor. [ARCHIVED]

Home Page:https://catherineisonline.github.io/fylo-landing-page-with-two-column-layout-frontendmentor/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Fylo landing page with two column layout

Solution for a challenge from frontendmentor.io.



About The Project

This project is great if you're starting to get confident with slightly more complex layouts. The second section with the testimonial area will provide a nice challenge.



Users should be able to:

  1. View the optimal layout depending on their device's screen size.
  2. See hover and focus states for interactive elements.

Built with

  • Semantic HTML5 markup
  • CSS custom properties
  • Grid & Flex
  • Desktop-first workflow

What I learned

A very easy project to keep updated with the Frontend Mentor projects and remember the basics!

Useful resources

  1. Figma - Paste your design image to check the size of containers, width, etc.
  2. Perfect Pixel - Awesome Chrome extension that helps you to match the pixels of the provided design.

Acknowledgments

A big thank you to anyone providing feedback on my solution. It definitely helps to find new ways to code and find easier solutions!

About

This is my solution to the Fylo landing page with two column layout challenge on Frontend Mentor. [ARCHIVED]

https://catherineisonline.github.io/fylo-landing-page-with-two-column-layout-frontendmentor/

License:MIT License


Languages

Language:HTML 48.3%Language:CSS 47.9%Language:JavaScript 3.8%