Elzero-Template

This is a project for creating a [Elzero Template] using HTML and CSS. I created it to improve my coding skills by building realistic projects.

Table of contents

• Overview
  • The Objective
  • Template Design
  • Links
• My process
  • Built with
  • CSS properties used
  • Layout
  • Useful resources
• Author
• Acknowledgments

Overview

The objective

Users should be able to:

• View the optimal layout depending on their device's
  screen size (Responsive Design)
• See hover and animation states for interactive elements

Template Design

Landing Screen

Links

• Source Code URL: here
• Live Site URL: here

My process

Built with

CSS properties used

• Media Queries And Responsive Design
• Flexbox
• CSS Grid
• Position
• Desktop-first workflow

Layout

The designs were created to the following widths:

• Small screen: 768px
• Medium screen: 992px
• Large screen: 1200px

Useful resources

• MDN
• W3 Schools
• Summary CSS Course

Author

Acknowledgments

• Elzero Academy