我有一个HTML/CSS/JS网站，我嵌入Facebook帖子，并添加一些文本(与各种信息和操作按钮)到每个帖子的顶部.我在Javascript中动态添加每个帖子上面的文本，这样嵌入的帖子(iframe)就在一个单独的容器中，而不是上面的文本.
正如你在下面的图片中所看到的，文本被定位为absolute，这样它就出现在文章的上方，而不是它的旁边.然而，我似乎不能让文章移动down，也不能让文本移动向上，以便在它们之间创建一些分离.任何帮助或 idea 将不胜感激！
更新:我的意思是包括一个代码en，以最少的代码再现问题:https://codepen.io/Mickey_Vershbow/pen/dyLzLNV?editors=1111
下面的代码也是:
// Array of facebook post ID's
facebookArr = [{
post_id: "pfbid0cm7x6wS3jCgFK5hdFadprTDMqx1oYr6m1o8CC93AxoE1Z3Fjodpmri7y2Qf1VgURl"
},
{
post_id: "pfbid0azgTbbrM5bTYFEzVAjkVoa4vwc5Fr3Ewt8ej8LVS1hMzPquktzQFFXfUrFedLyTql"
}
];
// Variables to store post ID, embed code, parent container
let postId = "";
let embedCode = "";
let facebookContainer = document.getElementById("facebook-feed-container");
$(facebookContainer).empty();
// Loop through data to display posts
facebookArr.forEach((post) => {
let relativeContainer = document.createElement("div");
postId = post.post_id;
postLink = `${postId}/?utm_source=ig_embed&utm_campaign=loading`;
// ---> UPDATE: separate container element
let iframeContainer = document.createElement("div");
embedCode = `<iframe src="https://www.facebook.com/plugins/post.php?href=https%3A%2F%2Fwww.facebook.com%2FIconicCool%2Fposts%2F${postId}&show_text=true&width=500" width="200" height="389" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowfullscreen="true" allow="autoplay; clipboard-write; encrypted-media; picture-in-picture; web-share" id=fb-post__${postId}></iframe>`;
// Update the DOM
iframeContainer.innerHTML = embedCode;
// ADDITIONAL TEXT
let additionalText = document.createElement("div");
additionalText.className = "absolute";
additionalText.innerText = "additional text to append";
relativeContainer.append(additionalText, iframeContainer);
facebookContainer.append(relativeContainer);
});#facebook-feed-container {
display: flex;
flex-direction: row;
row-gap: 1rem;
column-gap: 3rem;
padding: 1rem;
}
.absolute {
position: absolute;
margin-bottom: 5rem;
color: red;
}
.risk-container {
margin-top: 3.5rem;
}<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<div id="facebook-feed-container">
</div>