ekecso / responsive-club

Codecademy project

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Codecademy Project: Responsive Club Website

"In this project, you’ll be building your own club group page that will dynamically respond as you adjust the size of your screen!​"

Project Requirements

"In this project, you’ll build a webpage for a local club. You can base it on real-life organization you belong to or make one up! You’ll get to choose everything about your page: the club name, the page layout and styling, any images that you want to use, and more! You can check out our example site for some inspiration and experiment with what elements are responsive.

Your project should demonstrate many of the responsive design tools you learned. In our example project, we use percentages and relative units, such as em and rem, in our CSS to size and position page elements. We also made our website responsive by incorporating media queries to resize elements based on the size of the screen.

Possible responsive design concepts to demonstrate:​

  • Making images toggle to certain percentages in terms of width after a certain minimum screen size.
  • Using a @media rule to change page layout and behavior based on size breakpoints.
  • Employing responsive units em and rem to size and space elements with width and padding."

My Project: Denver Arts & Crafts Collective

My page is for a fictional group called the Denver Art & Crafts Collective.

Credits

Banner Photo by Jorge Franganillo on Unsplash

Featured Event Photo by Cassie Gallegos on Unsplash

Arts & Crafts Beer Photo by Teo Do Rio on Unsplash

Kids Club Photo by Aaron Burden on Unsplash

Adult Photo by Eddy Klaus on Unsplash

Youth Photo by Julietta Watson on Unsplash

About

Codecademy project


Languages

Language:CSS 63.0%Language:HTML 37.0%