两个单独的div，为什么一个渲染在另一个内？

Question

html before rendering

首先，我正在使用他们的木材框架在shopify中编码商店，该框架使用了css魔法响应网格。

正如你在图像中看到的那样，有一个网格，一个div应该跨越四分之一，另一个应该跨越四分之三。

现在，当查看页面时，3/4宽度div在1/4 div内部而不是在它之后呈现。如下所示： html after rendering

这绝对没有意义，我不明白为什么会发生这种情况，因为如果我将它们交换使得3/4宽度div位于四分之一宽度div之前，它们都可以很好地独立渲染，为什么呢？这件事发生了吗？

Answer 1

是否正确关闭了所有html标签？ 我建议您查看html页面的代码源，而不是使用浏览器开发工具检查它，以查看未解释的DOM树。