不同的图像大小不对称地向下移动div

时间:2017-04-10 14:54:28

标签: html css html5 css3

我还有以下内容:

  <div class="row">
          <div class="col-md-4 content-column">
            <img class="btn-center btn-desktop" src="images/buttons/btn-desktop.svg" alt="desktop button">
            <h2 class="btn-desktop-headline">Desktop Applikationen</h2>
          </div>

          <div class="col-md-4 content-column">
            <img class="btn-center btn-webdesign" src="images/buttons/btn-webdesign.svg" alt="webdesign button">
            <h2 class="btn-webdesign-headline">Webdesign</h2>
          </div>

          <div class="col-md-4 content-column">
            <img class="btn-center btn-ios" src="images/buttons/btn-ios.svg" alt="ios Logo button">
            <h2 class="btn-ios-headline">iOS</h2>
          </div>
        </div>

现在,根据图像尺寸,标题会进一步向下移动。我怎么能解决这个问题?

1 个答案:

答案 0 :(得分:0)

处理此问题的最佳方法是将div设置为全宽和css指定的高度。当您从服务器端获取图像时,您应该将它们绑定在样式属性中。

这样做的好处是你可以在不弄乱纵横比的情况下拉伸图像并将其定位到div的中心。