This is a solution to the Fylo landing page with two column layout challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
Users should be able to:
- View the optimal layout for the site depending on their device's screen size
- See hover states for buttons and inpust elements on the page
- Solution URL: https://github.com/jorgedav-id/frontend-mentor-fylo-landing-page-challenge.git
- Live Site URL: https://modest-davinci-f8f530.netlify.app/
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- Mobile-first workflow
In this challenge, I learned to work with semantic HTML5 and work with CSS. Also, i learn about Flexbox. At the beginning I completed the challenge without following the Mobile-first approach, but then I tried to follow that approach and I found it more flexible and easy. Also, with this challenge I practice some of the git workflow.
I will focus to learn and improve my knowledge about flexbox and mobile-first workflow.
- htmlreference.io - This helped me for semantic html5 markup.
- cssreference.io - This page helped me with css properties that i didn't know and to check if the properties that i used was correct.
- A Complete Guide to Flexbox - This site was so useful to learn about flexbox.
- Frontend Mentor - @jorgedav-id
- Twitter - @jdavid_ACH