amp-list css 水平仅在桌面上显示 1 项

【问题标题】：amp-list css horizontal only showing 1 item on desktopamp-list css 水平仅在桌面上显示 1 项
【发布时间】：2017-11-20 00:15:57
【问题描述】：

在第二行内容的热门故事组件（amp-list）中，仅在桌面上显示第一项。当然这是一个高度/ css 问题。

https://www.standard.co.uk/business/media

有什么想法吗？

【问题讨论】：

标签： amp-html

【解决方案1】：

我查看了开发者控制台，似乎 css 存在一些问题。首先，要查看您需要设置trending-stories 的width: 100% 的所有故事，因为不设置trending 的内部容器的宽度会使amp-list 使用计算得到的宽度，即102.969px。然后在.trending .section 中设置clear: left;，这样标题就在正确的位置。

.trending .trending-stories {
    width: 100%;
}
.trending .section {
    clear: left;
}

希望对您有所帮助。

【讨论】：