Как изменить ширину столбца в зависимости от количества имеющихся столбцов?

Возьмем следующий пример реакции:

       <Container fluid>
        <Row>
          <Col md={4}>
            <TodoAdd />
          </Col>
          <Col md={8}>
            <TodoList />
          </Col>
        </Row>
      </Container>

Иногда второй столбец отсутствует в DOM. Когда это происходит, я бы хотел, чтобы свойство 'md' в первом столбце было {12}.

Другими словами, я хотел бы, чтобы столбцы были плавными, то есть занимали всю ширину строки, когда столбцы-братья отсутствуют.

0
0
425
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Сделать это можно так:

  <Container fluid>
    <Row>
      <Col>
        <TodoAdd />
      </Col>
      <Col md={8}>
        <TodoList />
      </Col>
    </Row>
  </Container>

Первый столбец будет занимать столько места, сколько оставлено другими столбцами, размер которых указан (через md, sm и т. д.).

Другие вопросы по теме