1

I'm using reactstrap (based on Bootstrap4) to create a React app. I am trying to create a side-by-side pair of cards (a login and register set) that, when the browser is small, would go one above the other. I can get them centered horizontally, but not vertically. Seems like the container/row/col does not expand to fill the window. How would one go about centering this?

See https://codesandbox.io/s/71r9x2ynwx for a working example.

alphadogg
  • 12,762
  • 9
  • 54
  • 88
  • If you apply the css from the alleged duplicate question, it doesn't work. See https://codesandbox.io/s/426277vml9 – alphadogg Jan 31 '18 at 16:18
  • 1
    Read the other question/answer. All the container(s) (html,body,.container,etc..) of the content you want to center must be full height. https://www.codeply.com/go/WYw4VWxB4F – Carol Skelly Jan 31 '18 at 16:21
  • 1
    Thanks, @ZimSystem, I added the .full-height class and didn't realize I had to add it to both `Container` and `Row`. – alphadogg Jan 31 '18 at 16:43

0 Answers0