December Challenge


December 2023

Layout Challenge

Crossing & Overlap


We're back with a layout challenge to close out the year! This time we're only doing two layout mockups, but regardless; choose one, and make a code! The layouts are intended to be as "blank slate" as possible - what content they should have and where it should go is entirely up to you.

This layout challenge comes with two difficulty levels - Crossing is a fairly simple grid layout, and Overlap is a chunky layout that requires the use of negative margins.

Pick the layout that best fits your skill level, or challenge yourself!

Crossing

crossing.png

Overlap

overlap.png

The Challenge:

  • Create a code using either the 'Crossing' or the 'Overlap' layout.
  • You don't have to use the exact same sizes, but keep the proportions roughly the same.

You may...

  • Make small layout adjustments, like splitting one box into two or changing the amount of boxes in a group.
  • Alter the style to your liking. Changing border radiuses, margins and colours is encouraged.

You may not...

  • Flip or rotate the layouts.
  • Combine layouts together.
  • Frankenstein, copy or take heavy inspiration from other coders. All code should be your own.

Your posted code should either credit Togo for the layout, or link back to this challenge. The credit doesn't need to be included in the code - it can just be mentioned in a text block above the preview.

You only need to make one code to recieve your challenge point - however, you can make multiple codes using different layouts for bonus points.


Submissions will close on December 25th.

Have any comments, questions, concerns or feedback?

COMMENT HERE

Finished with your code?

SUBMIT HERE