css - 如何使用灵活的布局将元素置于 Windows 8 [HTML5/JS/CSS3] 中

我正在用 HTML5 构建一个 Windows 8 应用程序，我试图将我的应用程序菜单居中放置在屏幕中间。我知道有新的 CSS3 可以通过使用灵活的框来应用此功能，但是我无法重新创建它。这是我的 HTML

<body>
<div id="playControl">
    <button>Back</button>
    <button>Play</button>
    <button>Forward</button>
</div>
</body>

这里有一些信息，但看起来不能正常工作(我猜他们更改了属性名称)

谢谢

最佳答案

这是我的做法。我使用网格而不是 flexbox。假设您的 div 在名为“parent”的 div 中。我会用...

#parent {
    display:-ms-grid;
    -ms-grid-columns:1fr;
    -ms-grid-rows:1fr;
    height:100%;
}

然后在你的 div 上我会使用...

#yourDiv {
    -ms-grid-column-align: center;
    -ms-grid-row-align: center;
}

请注意，您需要为父 div 提供单行和单列以及 100% 的高度。然后你需要为子 div 设置对齐方式(初始值为'stretch')。希望对您有所帮助。

关于css - 如何使用灵活的布局将元素置于 Windows 8 [HTML5/JS/CSS3] 中，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/13655797/