Html 居中对齐调整大小的绝对div

我设置了一个页面，但是我在将新闻文章与页面中心对齐时遇到问题

这里有一个到目前为止我所拥有的链接-

基本上，我需要红色区域始终与边缘保持相同的距离，即使它扩展。这可能吗

红色容器的css为position:absolute

任何帮助都将不胜感激

注：这只是我学习css和html的第一周，如果内容简单，请原谅我

---

谢谢

我想您不需要position:absolute，您可以删除此属性并添加以下内容：

.collection {
   display:table;
   margin:auto;
}

---

有很多是可以改进的，但对于你的问题，我会这样做：

.collection {
    position: static;
    display: inline-block;
}
.roundcont {
    text-align: center;
}

---

您基本上需要删除位置：绝对；属性，并将其显示更改为内联或内联块，然后设置文本对齐中心；对于父div，它现在看起来居中。

为什么要使用position:absolute？据我所知，这是在子div“增长”时自动扩展div宽度的唯一方法。为什么要使用iFrame？除非您正在显示来自其他网站的内容，否则不要这样做。它效率低、速度慢，并且在CSS和JS中都会导致问题。链接页面是我网站的一部分，但由于它们是自动调整大小的，所以当它们被嵌入时，我无法摆脱滚动条，仅此而已。一个例子：哦，哇，这非常有效：D