网站的 Android 视图存在问题：桌面浏览器上不显示一个栏

Question

我对我创建的网站的电话视图有疑问。在经典桌面浏览器（用 Chrome、Firefox 测试）上，我添加了获取响应行为：

<meta name="viewport" content="width=device-width, initial-scale=1">

不幸的是，与经典视图不同，Android 浏览器上的视图（也使用 Chrome 和 Firefox android 进行了测试），我有一个额外的水平灰色条出现在页面的右上角（在主菜单“科学编码”上方而且我不知道这个酒吧是从哪里来的？

在这里[链接][2]，您可以更好地在您的 android 上看到问题并将其与桌面浏览器进行比较：也许有人会在 Android 上找到此栏的起源（我不知道这是否也是iPhone 上的手机壳）。

Answer 1

此问题与 Android 或 iOS 无关。它发生在所有设备上，因为这是一个布局问题。我在使用 Firefox 的 MacBook Pro 上看到了这个栏，例如：

然而，它似乎是一个滚动条，其实不是。它是由这个 HTML 元素生成的：

<div class="horizontal_column">

应用这些 CSS 规则的对象：

border-color: #000000;
border-style: solid;
border-width: 15px 0 0 0;

正如您通过更改这些规则所看到的，“假滚动条”发生了变化。