android - 不支持在 Chrome for Android 中嵌套 吗？

Question

我在网上搜索了一些简单的方法来在网站上制作一个在所有浏览器上都一致的进度条。我已经通过使用元素而不是进度元素为 PC 实现了这一点，并且认为一切都很好，直到我使用 chrome 浏览器应用程序在我的 android 手机上查看该网站。

Android 版 Chrome 似乎不支持此代码？!有人可以为我指出正确的方向以使其正确显示吗？

#percent {
  background-color: black;
  border-radius: 10px;
  padding: 3px;
  color: yellow;
  height: 38px;
}

#inner {
  background-color: white;
  border-radius: 8px;
  height: 100%;
  width: 100%;
  float: right;
}

#bar {
  background-color: cyan;
  border-radius: 8px;
  text-align: center;
  line-height: 38px;
  color: blue;
  height: 100%;
  float: left;
}

<br><br><br>
<div id='percent'>
  <div id='inner'>
    <div style='width: 63%;' id='bar'><b>63% Full (1354.3 GiB Free)</b></div>
  </div>
</div>

Answer 1

我使用(桌面)chrome 设备模拟器测试了代码，它在各种设备上运行良好。但是，这不会模拟 Android 或 IOS 的 Chrome 应用程序，但设备的纵横比不会影响嵌套的 <div>。渲染与否。

我希望这能让您对您的问题有所了解。

附言您是否检查过您的 chrome 版本是否是最新的？它可能运行过时版本的 html/css