Set max width of card in flutter?

Question

I am trying to set the max width of a card in flutter but it seems to keep expanding. I tried placing the Card in a constrainedBox and then tried setting the max width but the card keeps filling out the entire width of the screen which looks horrible on web:

Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          //mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: [
            Padding(
              padding: const EdgeInsets.fromLTRB(10, 50, 10, 30),
              child: ConstrainedBox(
                constraints: const BoxConstraints(
                  maxWidth: 600,
                  maxHeight: 300,
                ),
                child: Card(
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(15.0),
                  ),
                  elevation: 10,
                  child: Image.asset(
                    'images/largeLogo.jpg',
                    height: 300,
                  ),
                ),
              ),
            ),

I then thought the crossAxisAlignment: CrossAxisAlignment.stretch might have been causing it. I remove that and changed it to center. This solved the stretching part, but then the image was larger then then card slightly so I saw square corners instead of the rounded corners on the card that I set. Also the image and card was no longer centered at this point and was left aligned.

Answer 1

the Column have a property mainAxisSize which by defaults is:

mainAxisSize: MainAxisSize.max,

set it to MainAxisSize.min like this:

Column(
      crossAxisAlignment: CrossAxisAlignment.stretch,
      //mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      mainAxisSize: MainAxisSize.min,            
       children: [
        Padding(
          padding: const EdgeInsets.fromLTRB(10, 50, 10, 30),
          child: ConstrainedBox(
            constraints: const BoxConstraints(
              maxWidth: 600,
              maxHeight: 300,
            ),
            child: Card(
              shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(15.0),
              ),
              elevation: 10,
              child: Image.asset(
                'images/largeLogo.jpg',
                height: 300,
              ),
            ),
          ),
        ),