<ul class="stepper" data-mdb-stepper="stepper" data-mdb-stepper-linear="true">

  <form class="needs-validation stepper-form" novalidate>

    <li class="stepper-step stepper-active">

      <div class="stepper-head">

        <span class="stepper-head-icon"> 1 </span>

        <span class="stepper-head-text"> step1 </span>

      </div>

      <div class="stepper-content py-3">

        <div class="row">

          <div class="col-md-3 col-sm-12">

            <div class="form-outline mb-2">

              <input type="text" id="linear-stepper-input-1" class="form-control" required />

              <label class="form-label" for="linear-stepper-input-1">step 1</label>

              <div class="invalid-feedback">invalid</div>

            </div>

          </div>

          <div class="col-md-3 col-sm-12 mb-2">

            <div class="form-outline">

              <input type="text" id="linear-stepper-input-1" class="form-control" required />

              <label class="form-label" for="linear-stepper-input-1">step 1</label>

              <div class="invalid-feedback">invalid</div>

            </div>

          </div>

          <div class="col-md-3 col-sm-12 mb-2">

            <div class="form-outline">

              <input type="text" id="linear-stepper-input-1" class="form-control" required />

              <label class="form-label" for="linear-stepper-input-1">step 1</label>

              <div class="invalid-feedback">invalid</div>

            </div>

          </div>

        </div>

      </div>

    </li>

    <li class="stepper-step">

      <div class="stepper-head">

        <span class="stepper-head-icon"> 2 </span>

        <span class="stepper-head-text"> step2 </span>

      </div>

      <div class="stepper-content py-3">

        <div class="form-outline">

          <input type="text" id="linear-stepper-input-2" class="form-control" required />

          <label class="form-label" for="linear-stepper-input-2">step 2</label>

          <div class="invalid-feedback">invalid</div>

        </div>

      </div>

    </li>

    <li class="stepper-step">

      <div class="stepper-head">

        <span class="stepper-head-icon"> 3 </span>

        <span class="stepper-head-text"> step3 </span>

      </div>

      <div class="stepper-content py-3">

        <div class="form-outline">

          <input type="text" id="linear-stepper-input-3" class="form-control" required />

          <label class="form-label" for="linear-stepper-input-3">step 3</label>

          <div class="invalid-feedback">invalid</div>

        </div>

        <button class="btn btn-primary" type="submit">Submit</button>

      </div>

    </li>

  </form>

</ul>