-2

https://codesandbox.io/s/card-material-ui-cqvet?file=/src/index.js

As you can see in this codesandbox.io, the div inside which there's a button doesn't seem to have an effect on the button inside of it as it behaves like a left float for some reason. Is there something I am missing here. I understand that there are several flex box around that container, but in my understanding it should not have any effect on it, or am I wrong?

button: {
    display: "flex",
    width: "100%",
    alignItems: "center",
    flexDirection: "row"
  }
Sayaman
  • 1,145
  • 4
  • 14
  • 35

1 Answers1

1

to align along main axis use

justify-content: center

instead of align-items

ashish singh
  • 6,526
  • 2
  • 15
  • 35