jquery - 卡片尺寸因图像高度而不同？

Question

我创建了一个设计，供用户选择不同的模板。所有功能都工作正常，但由于图像尺寸不同，我的卡片设计存在问题。

我已经尝试了在行和列上使用 Flex、固定图像大小和卡片大小的所有方法，但没有成功。

这是我当前的屏幕:

        <div class="row">
          <? $sql = mysqli_query($conn,"SELECT * FROM payslip_template WHERE status = 'a'");
          $i = 1;
          while($row = mysqli_fetch_array($sql)) { ?>
            <div class="col-md-4 imgcol">
              <div class="card imgcard" id="imgcard_<? echo $i; ?>" <? if($row[ 'temp_default']=='y' ) { ?>style="background-color:#8a7f83;"
                <? } else { ?> style="background-color:#dedad1;" <? } ?>>
                <div class="card-title text-center imgtitle">
                  <?= strtoupper($row['name']); ?>
                </div>
                <div class="card-body">
                  <img src="<?= $row['temp_image']; ?>" class="img-fluid">
                  <div class="row btnrow">
                    <div class="col-md-6">
                      <button type="button" class="<?= $BUTTON_CLASS_DEFAULT; ?>" onclick="defaultact(this.value);" value="<?= $row['aid']." _ ".$i; ?>" style="width: 100%">
                      <i class="<?= $ICON_CLASS_DEFAULT; ?>"></i>
                      Default
                    </button>
                    </div>
                    <div class="col-md-6">
                      <button type="button" class="<?=$BUTTON_CLASS_PREVIEW; ?>" onclick='preview(this.value)' ; value="<?= $row['temp_image'];?>">
                      <i class="<?=$ICON_CLASS_PREVIEW; ?>"></i>
                      Preview
                    </button>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <? $i++; } ?>
        </div>

Answer 1

通过修复所有图像的高度和宽度，效果很好。