Question

我正在尝试使用CSS Grid控制我的Cesium容器元素。但是在Edge中，如果它在网格内，它似乎会自动缩放超过地球。如果我使用Chrome甚至是IE，似乎都不会发生。到底发生了什么，我应该如何应对？下面正在使用的基本代码。可以使用https://codepen.io/rachelandrew/pen/XdZydB将其插入：

CSS：

body {
  margin: 40px;
}
.wrapper {
        display: grid;
    grid-gap: 10px;
        grid-template-columns: repeat(auto-fill, [col] 100% ) ;
        grid-template-rows: repeat(auto-fill, [row] auto  );
        background-color: #fff;
        color: #444;
    }
    .box {
        background-color: #444;
        color: #fff;
        border-radius: 5px;
        padding: 20px;
        font-size: 150%;

    }

    .a {
        grid-column: col / span 2;
        grid-row: row ;
    }

HTML：

<div class="wrapper">
  <div id="cesiumContainer" class="box a">A</div>
</div>
  <script src="https://cesiumjs.org/releases/1.55/Build/Cesium/Cesium.js"></script>
  <link href="https://cesiumjs.org/releases/1.55/Build/Cesium/Widgets/widgets.css" rel="stylesheet">

JS：

var viewer = new Cesium.Viewer('cesiumContainer');

编辑：起初我没有注意到，但是我将溢出设置为隐藏。删除后发现，使用铯时，Edge似乎永远增加了元素的大小。我认为这与

有关

        grid-template-columns: repeat(auto-fill, [col] 100% ) ;

编辑2：我最终放弃了与铯有关的工作的网格。我从未找到使用网格技术的解决方案。相反，我实现了弹性组，它们似乎不会以相同的方式影响渲染。我确实保留了其他框架的副本，希望能找到解决方案，如果我这样做，除非有人击败我，否则我将发布官方答复。

如何在铯元素中正确嵌入铯

0 个答案: