I am trying to make have two buttons side by side, as in the screenshot below.

I have tried numerous resources online but to no luck. I have even tried making the broader column into a row, however, that throws off the design completely.

Is there a way to add a second button beside the current one without being too obtrusive?

  const SizedBox(height: 16.0),
            OutlineButton(
              onPressed: () {},
              child: Text('Continue'),
              borderSide: BorderSide(color: Color(0xff33333D)),

Which is apart of

Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  'Some Text',
                  style: TextStyle(
                    fontSize: 24,
                    fontFamily: 'Avenir',
                    fontWeight: FontWeight.w900,
                  ),
                ),
                const SizedBox(height: 16.0),
                Text(
                  "Some Text.",
                  style: TextStyle(
                    fontSize: 20,
                    fontFamily: 'Avenir',
                  ),
                ),
                const SizedBox(height: 16.0),
                OutlineButton(
                  onPressed: () {},
                  child: Text('Continue'),
                  borderSide: BorderSide(color: Color(0xff33333D)),

Edit based on answer:

Row(
                    children: [
                      OutlineButton(
                        onPressed: () {},
                        child: Text('Login'),
                        borderSide: BorderSide(
                          color: Color(0xff33333D),
                        ),
                      ),
                      SizedBox(
                        width: 15,
                        height: 25,
                      ),
                      OutlineButton(
                        onPressed: () {},
                        child: Text('Sign Up'),
                        borderSide: BorderSide(
                          color: Color(0xff33333D),

Example:

enter image description here


Solution 1: Raine Dale Holgado

You can wrap it with parent Row widget

  Column(
    crossAxisAlignment: CrossAxisAlignment.start,
    children: [
      Text(""),
      Text(""),
      Row(
        children: [
          OutlineButton(
            onPressed: () {},
            child: Text('Continue'),
            borderSide: BorderSide(
              color: Color(0xff33333D),
            ),
          ),
          SizedBox(width: 10),
          OutlineButton(
            onPressed: () {},
            child: Text('Continue'),
            borderSide: BorderSide(
              color: Color(0xff33333D),
            ),
          ),
        ],
      )
    ],
  )