'Responsive container needs be filled height and width

Please help how I can fill container in a height and width? It is necessary that the container is always filled with a chart, regardless of the height and width.

<div className={styles.widget}>
  <div className={styles.content}>
    <ResponsiveContainer className={styles.container} width="99%" minHeight="100%" aspect={3}>
        <LineChart
          width="100%"
          height="100%"
          data={data}
          tickFormatter={(tick) => `${tick}%`}
          margin={{
            right: 20,
            top: 0,
            left: 0,
            bottom: 0
          }}
        >
        <CartesianGrid 
          horizontal="true"
          vertical="true"
          className={styles.grid}
          strokeDasharray="5, 5"
          stroke="#7E8699"
        />
        ....
      </LineChart>
    </ResponsiveContainer>
  </div>
</div>

CSS code

.widget {
    background: rgba(255, 255, 255, 0.8);
    position: relative;
    border-radius: 6px;
    overflow: hidden;
    height: 100%;
}

.content {
    overflow: auto;
    height: 100%;
    padding-top: 45px;
}


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source