html - 如何使用 HTML5、WinJS 在 Metro Apps 的垂直列中排列 ListView ？

Question

我有一个 Metro 应用程序，其中包含 2 个带有一些列表项的 ListView 。这 2 个 ListView 默认情况下一个在另一个下面，每次当我向我的页面添加一个 ListView 时，所有 ListView 都显示一个在另一个下面。问题是我不想水平显示这些 ListView 。我希望它们并排显示。那么，任何人都可以帮助我如何并排排列具有 Metro 应用程序外观的 ListView 。

谢谢。

Answer 1

CSS

.ms-grid
{
    display: -ms-grid;
    -ms-grid-rows: 1fr;
    -ms-grid-columns: 1fr 1fr;
}

HTML

<div class="ms-grid">
    <div data-win-control="WinJS.UI.ListView"></div>
    <div data-win-control="WinJS.UI.ListView" style="-ms-grid-column: 2;"></div>
</div>