Line Up the Left Edges

Part of the Your First App section of Coddy's Flutter journey. Lesson 23 of 32.

The other direction of a Column, across it, is its cross axis. By default each child is centered across the column, so a short line and a long line do not start at the same place.

crossAxisAlignment: changes that:

Column(
  crossAxisAlignment: CrossAxisAlignment.start,
  children: [...],
)

In a Column, CrossAxisAlignment.start lines the children up on the left, end on the right, and center is the default.

Challenge

Easy

Make both lines start at the same left edge, with the column's crossAxisAlignment:.

Try it yourself

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: Column(
            children: [
              Text('Name', style: TextStyle(fontSize: 24)),
              Text('A much longer line', style: TextStyle(fontSize: 24)),
            ],
          ),
        ),
      ),
    );
  }
}