Alex
Alex

Reputation: 323

MUI: div height - expand to fit content

I'm using MUI to style a React app. I'm stuck on how to best set a div's height to expand with the content. In the example below, I have a Card containing a Button. When the Button is clicked, the content expands down below the Card itself.

How can I adjust it so that the Card expands to fit the content when the button is clicked? I know one issue I'm having is that I'm hard coding the Card height...

https://codesandbox.io/s/objective-chaum-e61iq1?file=/src/App.js

Upvotes: 0

Views: 6820

Answers (2)

Dmitriif
Dmitriif

Reputation: 2433

Just set up the height of a Card component to fit-content and delete the hardcoding height from every component inside the Card:

Demo

Upvotes: 1

bryce
bryce

Reputation: 3051

Add height: "100vh" to the "Clicked" div:

https://codesandbox.io/s/blazing-shadow-bo3cqw

Upvotes: 0

Related Questions