ResponsiveContainer not resizing

Hey guys,

I’m currently building an app for a NGO and i’m using Recharts. So far it looks great however when I try to go into responsive mode the charts won’t resize.

Code I’m using:

Where it is rendered:

` <div className="row">

                <div className=" col-md-6 col-sm-12 col-xs-12">

                       <Chart />

                </div>

            </div>

`

And the component itself: ` <div style={{height:‘300px’, width: ‘600px’}}>

            <ResponsiveContainer width="100%">
                    <BarChart data={data}
                        margin={{ top: 5, right: 30, left: 20, bottom: 5 }}>
                        <XAxis dataKey="estadoCivil" />
                        <YAxis />  
                        <CartesianGrid strokeDasharray="3 3" />
                        <Tooltip />
                        <Legend />
                        <Bar dataKey="cantidad" fill="#8884d8" />
                    </BarChart>
            </ResponsiveContainer>
         </div>`

I’m using React 16.0 and Recharts 1.0.0

I’ve tried a few solutions I found online but none is working so far. My lastest attempt was wrapping the component inside a div with fixed height and width just as a test, but still not working.

[knro]

@ericdcobb Yes, it turned out to be CSS from redux-form that was causing this issue. I removed the CSS (and redux-form altogeather) and it works fine now. So most likely contributor is some rogue CSS somewhere.

[ericdcobb]

@knro did you happen to figure this out?