更改 flexbox 中第二个 child 的背景颜色

Change background color of the second child in a flexbox

我想将 flexbox 中第二个 child div 的背景色设置为红色,但我做不到。我只能设置第一个 child 的背景颜色。

.main{
  display: flex;
  justify-content: center;
  flex-flow: row wrap;
}
.left_col{
  width: 350px;
  background-color: green;
};
.right_col{
  width: 350px;
  background-color: red;
}
<div class="main">
  <div class="left_col">
  This is the left column. It should be green.
  </div>
  <div class="right_col">
  This is the right column. It should be red.
  </div>
</div>

https://jsfiddle.net/mademoiselletse/e5nhca58/2/

第二个 child 的文本对齐方式也与第一个 child 不同。第一个 child 的文本向左对齐,而第二个 child 的文本向中心对齐。我是 flexbox 的新手。非常感谢您的帮助!

; 在 css 中是不允许的,所以它破坏了样式表。删除它,它将起作用:

.main{
  display: flex;
  justify-content: center;
  flex-flow: row wrap;
}
.left_col{
  width: 350px;
  background-color: green;
}
.right_col{
  width: 350px;
  background-color: red;
}
<div class="main">
  <div class="left_col">
  This is the left column. It should be green.
  </div>
  <div class="right_col">
  This is the right column. It should be red.
  </div>
</div>