Html 列数：自动CSS使图像在1列后消失

我目前正试图用下面的代码创建一个响应模型，它在移动布局中看起来像一个单列，但一旦它达到足够2或3列的分辨率，右上角的图像和按钮就会消失，除非它们仍然在第1列中。任何帮助都将不胜感激。我这里有一把小提琴：

这是我正在与之斗争的主要领域，但我可能在其他地方出错，这影响了我的整体css

提前感谢您提供的任何帮助，这是我做过的第一次布局之一，请放心

  ul#products {
margin:1em 0;
padding-left:1em;
-webkit-column-count:auto;
-webkit-column-gap:2.5em;
-webkit-column-width: 310px;
}

---

看看动画属性，例如

-webkit背面可见性：隐藏设置为
.flip
和
face
：看起来此属性会导致不可见。
这些属性用于翻转框内的图像，但无助于恢复图像