Use the
Your job is to stop the incoming enemies from getting past your defenses. Unlike other tower defense games, you must position your towers using CSS!
We'll start with container properties. A flexbox container has a main axis and a cross axis.
Use the justify-content
property on the tower group container to move
your towers into effective positions. justify-content
positions a container's
items along the main axis and accepts the following values:
flex-start
: group items at the start of a container's main axisflex-end
: group items at the end of the main axiscenter
: group items in the center of the main axisspace-between
: evenly distribute items along the main axis such that the
first item aligns at the start and the final item aligns at the endspace-around
: evenly distribute items along the main axis such that all
items have equal space around themTry justify-content: center;
for example, to move the container's towers to
the center of the main axis.