我无法在 div 底部添加边距

Question

JS 小提琴

您好，我正在尝试在 #content 和 #content-main 的底部实现 15px 的边距，但我无法将两个 div 的底部边缘分开。 Imgur 这是问题区域的图片，我试图在底部的黄色（.content）的左右边缘实现相同的 15 毫米边距

这是我认为涉及的CSS；

#wrapper {
width: 1000px;
height: auto;
min-height: 500px;
margin: 40px auto 0px auto;
background: #444;
border-radius: 15px;
}
#main-content {
width: 960px;
height: auto;
background: #888;
margin: 0px auto 0px auto;
border-bottom-left-radius: 15px;
border-bottom-right-radius: 15px;
position: relative;
}
#main-content .content {
margin: 20px auto 0px auto;
padding: 15px 20px 15px 20px;

}

我尝试调整填充和边距，但 2 小时后我没有运气。我已经为所有内容添加了边距，只是为了看看它是否能解决问题，但我还不够了解这里发生了什么

这里有一些我尝试过的事情，尽管我明确地试图避免使用 jquery，如一个示例所示，以支持纯粹的 css

https://stackoverflow.com/questions/12030361/set-height-to-auto-plus-10 https://stackoverflow.com/questions/18159487/how-to-add-some-pixels-to-the-current-height-of-div https://stackoverflow.com/questions/69290425/cant-add-a-bottom-margin-to-table

Answer 1

感谢 cj0x39e 对我最初帖子的回复。我在 #main-content 中添加了 20px 上边距，但忽略了这一点。重读他的评论后，这让我思考并意识到这一点

#main-content 上的 15px 填充、更好的着色以及删除边距已经解决了这个问题。谢谢你哥们

这是一个工作https://jsfiddle.net/wfLyckdv/2/