Google-maps-react: inline styles on the map container are breaking my view

[ChadMartinson]

    container: {
      position: 'absolute',
      width: '100vw',
      height: '100vh'
    }

is causing the map to leave my container

it used to be

    container: {
      position: 'absolute',
      width: '100%',
      height: '100%'
    },

and it worked just fine.

[tomjschuster]

You can override this through the Map component's containerStyle prop:

const containerStyle = {position: 'absolute', width: '100%', height:'100%'}

<Map google={this.props.google} containerStyle={containerStyle}/>

[kevinSuttle]

I used the following and absolute was still being set.

style={{position: 'relative', width: '93.5%', height: '400px' }}

#map {
  position: relative !important;
}

[tomjschuster]

@kevinSuttle, it looks like you're just changing the map style, but not the container style. Try including:

containerStyle={{position: 'relative'}}

as well.

[kevinSuttle]

Thanks!

[ryanoboril]

Can this issue be closed?

[mukhtorov]

if I do position: relative map is not displaying..