1. Choose Dates
  2. Passenger Details
  3. Seat selection
  4. Payment confirmation
  5. Booking confirmation

Seat selection

PassengerSeat
Mr. Brett JonesPlease select

Selected seat:

 

Plane
CSS Grid a Day

This is the ‘CSS Grid a day’ entry for May 14.

An example of using CSS grid every day, running from May 1–31st, 2019.

About this entry

Unlike booking flights, creating this flight seat picker was fun, and a good opportunity to practice setting state in React.

I particularly like how easy it is to declare a responsive layout by changing a grid’s template columns, rows, and areas for certain media queries—it’s pretty easy to work with.

← PrevIndexNext →