CSS将背景颜色扩展到页面的右侧

Question

使用HTML等

<code style="background-color: #FFFFD9">
some block
of code
</code>

是否可以将背景颜色延伸到页面的右侧（而不是文本的位置）？

我不想使用＆lt; div＆gt;因为代码块嵌套在＆lt; ul＆gt;中或者＆lt; ol＆gt;所以我想保留代码块左侧的空白区域，因为列表存在任何缩进级别。

Answer 1

另一种可能的造型：

<code style="display:block; white-space:pre; width:100%; background-color: #FFFFD9;">
some block
of code
</code>

Answer 2

我们可能需要查看更多的标记和CSS，但您是否尝试过将width设置为100％？

code { background: #ffffd9; width: 100%; }

Answer 3

我发现答案是把＆lt; code＆gt;在一个只有一个单元格的表中。然后可以为表格指定CSS，使其具有100％宽度，没有边距填充等等。

这使左手缩进保持白色与＆lt; ol＆gt;＆lt; li＆gt;＆lt; ul＆gt;＆lt; li＆gt;放置代码块。彩色背景然后延伸到右侧。

CSS：

.tablecodeblock, .tablecodeblock td {width: 100%; border: 0; padding: 0; margin: 0}
.tablecodeblock td {background-color: #FFFFD9}

HTML：

<table class="tablecodeblock"><tr><td><code><xmp>Some block
of code</xmp></code>
</td></tr></table>