Main.js

import React, {Component} from 'react'
import { Container, Header, HeaderContent, Grid, GridColumn } from 'semantic-ui-react'
class Main extends Component {
  constructor (props) {
	super(props)
	this.state = {
	  hello: 'heeeeeeello',
	  browser: {height: window.innerHeight, width: window.innerWidth},
	  headerHeight: 50
	}
  }
  gridHeight = () => {
    return this.state.browser.height - this.state.headerHeight
  }
  render () {
    return (
    	<Container style={{width: '100%', height: this.state.browser.height, backgroundColor: 'yellow'}}>
		  <Header style={{backgroundColor: 'red', height: this.state.headerHeight}}>
			11111
		  </Header>
		  <Grid style={{height: this.gridHeight()}}>
			<GridColumn width={2} style={{backgroundColor: 'green'}}>11</GridColumn>
			<GridColumn width={14} style={{backgroundColor: 'blue', width: '100%'}}>22</GridColumn>
		  </Grid>
		</Container>
	)
  }
}

export default Main