Question

我有一个带有CSS的标头，在我测试过的所有浏览器（包括Windows PC上的Chrome）上都可以正常工作。只有我手机的Android Chrome（版本68.0.3440.91）无法正确显示。

应该是这样的： the proper version of the header

工作正常，但在Android的Chrome上除外：the improper version of the header

如您所见，两个圆圈（带有文本“ IR”和“ PS”）在Android的Chrome浏览器中不会浮动，即使它应该浮动。

我想这是div class =“ test”的问题。

如果您能帮助我使两个圆圈在标题中向右浮动，我将不胜感激！

HTML：

    let fileName: string = `public/static/${data["name"]}`;
    let file: Storage.File = this.bucket.file(fileName);

    var fileBuffer = Buffer.from(data["source"], 'base64');

    return from(file.save(fileBuffer, { contentType: data["contentType"], public: data["isPublic"] }))
        .pipe(map(() => {
            return { source: `${this.publicURLPrefix}/${fileName}` }
        }));

CSS：

<div class="menu">
  <ul class="active"> <!-- Invisible menu to be toggled on -->
   <li><a href="index.php">Homepage</a></li>
   <li><a href="about.php">About</a></li>
  </ul>

  <a class="toggle-nav" href="#">&#9776;</a>

  <div class="menutext">OOIR</div> <!-- the "logo", simplified code -->

  <div class="test"> <!-- this should float right, but it doesn't! -->
   <span class="circleIR">IR</span>
   <span class="circlePS">PS</span>
  </div>

</div>

CSS Sticky标头-仅Android上的Chrome无法正确显示

0 个答案: