The Qcards are not aligned.

[yyzai666]

Excuse me, how can I align the Qcard? Please help me check the code. Due to the "q-col-gutter-md", the bottoms of the two columns are always not aligned. please!please ! thanks!

  <div class="row q-col-gutter-md  ">
      <div class="col-md-6 col-sm-6 col-xs-12">
        <q-card class="master-card" flat bordered>
          <q-img src="https://cdn.quasar.dev/img/parallax2.jpg">
            <div class="absolute-bottom text-subtitle2 text-center">Title</div>
          </q-img>
        </q-card>
      </div>
      <div class="col-md-6 col-sm-6 col-xs-12 ">
        <div class="row q-col-gutter-md ">
          <div class="col-md-6 col-sm-6 col-xs-6">
            <q-card class="slave-card  " flat bordered>
              <q-img src="https://cdn.quasar.dev/img/parallax2.jpg">
                <div class="absolute-bottom text-subtitle2 text-center">Title</div>
              </q-img>
            </q-card>
          </div>
          <div class="col-md-6 col-sm-6 col-xs-6">
            <q-card class="slave-card " flat bordered>
              <q-img src="https://cdn.quasar.dev/img/parallax2.jpg">
                <div class="absolute-bottom text-subtitle2 text-center">Title</div>
              </q-img>
            </q-card>
          </div>
          <div class="col-md-6 col-sm-6 col-xs-6">
            <q-card class="slave-card " flat bordered>
              <q-img src="https://cdn.quasar.dev/img/parallax2.jpg">
                <div class="absolute-bottom text-subtitle2 text-center">Title</div>
              </q-img>
            </q-card>
          </div>
          <div class="col-md-6 col-sm-6 col-xs-6">
            <q-card class="slave-card " flat bordered>
              <q-img src="https://cdn.quasar.dev/img/parallax2.jpg">
                <div class="absolute-bottom text-subtitle2 text-center">Title</div>
              </q-img>
            </q-card>
          </div>
        </div>
      </div>
  </div>
</div>

The running result is as follows, see the red line:

[stefanvanherwijnen]

Reduce the height of slave-card? 2 x [height of slave card] + gutter should equal height of master card.

[yyzai666]

Thank you. I solved the problem by deleting the redundant div.

[yyzai666]

There are too many div nestings. Just delete the redundant div and the q-col-gutter-md at the top.