Материал UI Высота карты

Я уверен, что упускаю что-то простое здесь, но я не могу понять это за всю свою жизнь.

  • я использую Material-UI компоненты карты в React для отображения альбомы со списками треков. Карточки расширяются и заполняются 100% их родительского контейнера так, что при раскрытии одной карты все они расширяются в высоту.
  • Как я могу остановить другие карты от расширения с их родителем элемент и заставить их оставаться на достаточной высоте, чтобы показать то довольна?

Только развернутая карта должна изменить высоту. Вот скриншот того, что я имею в виду: material-ui cards

1 3
reactjs material-ui

1 ответ:

Вы можете применить стили к карте.

 var cardStyle = {
    display: 'block',
    width: '30vw',
    transitionDuration: '0.3s',
    height: '45vw'
}

И в вашем Карточном стиле вы можете применить вышеупомянутый стиль с помощью

  <Card style={cardStyle}>
                <CardHeader
                  title="URL Avatar"
                  subtitle="Subtitle"
                  avatar="https://placeimg.com/800/450/nature"
                />
3