Question

我有一个地铁都会瓷砖的网站。在桌面上，所有图块的宽度都是固定的。不过，我希望某些div基于移动设备时的内容高度。

如果我将高度设置为自动，则div消失。

我的网站是http://p2p.rudtek.com/you/。桌面上的一张照片是一块宽瓷砖，下面的内容是一块高瓷砖。

.tile.tall {
    width: 488px;
    height: 737px;
}

.tile-post.wide {
    width: 737px;
    height: 488px;
       color: #FFFFFF;
       font-size: 4em;
}

在移动设备上，我希望它们为全角和自动高度。

我尝试过：

@media screen and (max-width: 480px) {
  .tile-post.wide {
    width: 100%;
    height: auto;
    padding-bottom:0;
  }
  .tile-post.tall {
    width: 100%;
    height: auto;
  }
}

宽度很好，但是当我使用自动时，它们不会显示，所以我必须放一个高度。有什么方法可以根据内容使它们自动变高吗？

Answer 1

您需要将此添加到您的移动CSS：

var colorArray = [...lots of colors]

var lastColor = colorArray[colorArray.length - 1]

如何为移动设备但固定桌面设置div的自动高度

1 个答案: