This is a solution to the Spense Landing Page. Codewell challenges help you Improve your HTML and CSS skills by practicing on real design templates.
Users should be able to:
- View the optimal layout for the site depending on their device's screen size
- Solution URL: Github Repo
- Live Site URL: Live Preview
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- SCSS
Another fantastic challenge from codewell. The implementation of the design in code was quite straight forward, it provided good practice for responsive layouts. I implemented my scss Media queries differently in this project to make them more maintainable:
/**************************/
/* BELOW 768px (Tablet) */
/**************************/
@include respond-to(sm){
@include flex-center-column;
flex-direction: column-reverse;
}
I will be maintaining this approach for future projects.
- Website - KXLA 🤙