具有vh大小的Flexbox

Question

我尝试使用flexbox中心2个块。 我有节，他们有100vh。 需要将第一块放在中心位置。第二块放在底部中心。

*********************
*                   *
*                   *
*      center       *
*                   *
*                   *
*  bottom-center    *
*********************

js css课程：

const content = {
  textAlign: 'center',
  padding: '0!import',
};

const someSection= {
  paddingTop: '78px',
  paddingBottom: '78px',
  display: 'flex',
  flexDirection: 'column',
  justifyContent: 'center',
  minHeight: '400px',
  height: '100vh',
};
const container = {
  maxWidth: '1140px',
};
const title = {
  margin: '0',
  marginTop: '78px',
};
const sectionFooter = {
  marginTop: 'auto',
  width: '100%',
};

jsx代码：

    <div style={content}>
      <section style={someSection}>
        <div style={container}>
          <h1 style={title}>Title Name</h1>
        </div>
        <div style={sectionFooter}>
          <FlatButton label="button" />
        </div>
       </section>
    </div>

需要按钮到中下方，容器到中间中心