html - 相对父级的相对子级 100% 宽度

Question

我怎样才能让一个相对的 div 成为其父级宽度的 100%，而父级也是相对的？

我想在我的网页上有一个部分，我可以在其中显示带有代码标签的代码片段，但是我希望能够定位代码，使其宽度是其父容器的 100%(无论内部文本如何) .

function exactly_like_how_stackoverflow_handles_snippets() {
    return "In the same way that most websites handle code snippets";
}

我已经尝试检查其他网站是如何做到的，但我无法破译 css...也许我遗漏了什么

这是一个例子 https://jsfiddle.net/84ejfou7/

如果不是因为我希望代码片段位于文本之间(同样，与上面的代码片段完全一样)，绝对定位将是完美的

我几乎已经尝试了所有我能想到的方法，唯一可行的是直接以像素为单位指定宽度，但这不是解决方案，因为我的网站是响应式的，而且父网站的宽度是百分比。

Answer 1

您可以将代码标记的显示属性设置为阻止:

.parent code {
  position: relative;
  background: blue;
  display: block;
}

jsFiddle example