iOS设备上的100％高度不起作用

Question

我在html中绘制一条垂直线，如下所示：

＆＃13;

＆＃13;

.vr-long {
  background: #000000;
  border: none;
  width: 1px;
  height: 100%;
}

＆＃13;

<hr class="vr-long">

＆＃13;

＆＃13;

＆＃13;

这适用于所有设备（PC，Android）和每个经过测试的浏览器，除了我的ipad上的所有浏览器（iphone未经过测试）。在我的ipad上，所有垂直线都消失了。问题似乎是＆＃34;身高：100％;＆＃34;因为当我使用height: 50px;时，我会得到那条垂直线。

如何让height: 100%在iOS上运行？

顺便问一下：当我使用img-tag通过使用repeat-y和height绘制垂直线时出现同样的问题：100％......

Answer 1

我通过使用div作为垂直lign解决了这个问题。

＆＃13;

＆＃13;

.vr-long {
  margin: 0 2em 0 2em;
  border: 1px solid #000000;
}

＆＃13;

<div class="vr-long"></div>

＆＃13;

＆＃13;

＆＃13;

我仍然不知道为什么这个问题只出现在我的ipad上，但是这个工作并没有引起任何问题。