Question

考虑以下代码：

问题：如果内部没有圆形按钮，如何使输入组扩大到整个容器的宽度？

已经尝试了flex-grow。对我没用。

.btn_circle {
        width: 30px;
        height: 30px;
        text-align: center;
        padding: 6px 0;
        font-size: 12px;
        line-height: 1.428571429;
        border-radius: 15px;
        min-width: 30px;
        min-height: 30px;
    }

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet"/>
    <div class="jumbotron shadow py-2 px-3">
      <div class="row col-12 px-0 mb-2">
        <div class="col-11">
          <div class="input-group input-group-sm">
            <div class="input-group-prepend">
              <span class="input-group-text form__prepend">
                <b>№1</b>
              </span>
            </div>
            <input type="text" class="form-control form-control-sm" placeholder="blah blah blah" />
          </div>
        </div>
        <div class="col-1 pr-0 d-flex justify-content-end form__delivery__delete">
          <button class="btn btn-primary btn_circle">
            <i class="fas fa-times"></i>
          </button>
        </div>
      </div>
    </div>

Answer 1

删除col- *类并为两个孩子调整flex-grow属性都很好！

如果.row中没有其他兄弟姐妹，我该如何使它成为增长元素？

1 个答案: