CSS Master · Flexbox & Grid

Drone Dock

Write the CSS yourself and fly every drone to its charging pad. The hangar is a real flex or grid container, so your code runs exactly as it would in a browser.

0/18 cleared

01Far end

Flexbox

Welcome to the hangar. Your drone needs to reach its charging pad on the right. Use justify-content on the hangar to move drones along the row.

justify-content: flex-start · flex-end · center · space-between · space-around · space-evenly

hangar.cssruns as you type

.hangar {

display: flex;

}

0/1 docked

Type CSS in the editor. The drones follow it as you type.