0

I want to align a text inside a container. I used the padding class for the container which contains the text. The padding works, but it seems EdgeInsets.fromLTRB offsets the text and the background color of the container all together. Why does it happen? I can use mainAxisAlignment, but I wanted to understand why the padding class shifts the background color. Thanks.

new Container(
  width: 311,
  height: 48,
  //padding: EdgeInsets.all(15),
  padding: EdgeInsets.fromLTRB(127.5, 0, 0, 0),
  decoration: new BoxDecoration(
      color: Color(0xfffb2cfef),
      borderRadius: BorderRadius.circular(16)),
  child: Row(
    //mainAxisAlignment: MainAxisAlignment.center,
    children: [
      new Text(
        "Create account",
        style: TextStyle(
          fontFamily: 'Montserrat',
          color: Colors.white,
          fontSize: 16,
          fontWeight: FontWeight.w500,
          fontStyle: FontStyle.normal,
        ),
      ),
    ],
  ),
),

iOS simulator screenshot

nvoigt
  • 75,013
  • 26
  • 93
  • 142
anar
  • 11
  • 3

1 Answers1

0

You use color in your decoration

decoration: new BoxDecoration(
    color: Color(0xfffb2cfef),
    borderRadius: BorderRadius.circular(16)),

Try removing it

Fogan
  • 103
  • 10
  • 1
    Thanks a lot for the reply. I had the "Debug Paint" enabled in the Widget Inspector. Turned it off, everything is fine :) – anar Apr 02 '21 at 10:49