您如何在Zurb Foundation中出血列背景？

Question

Zurb Foundation 4在保持響應能力的同時將列的背景擴展到屏幕邊緣的方式是什么？

例如，請參見下圖中的藍色列。

更新：

我可以通過將列的子元素設置為margin-left: -9999px; padding-left: 9999px;來實現margin-left: -9999px; padding-left: 9999px; margin-left: -9999px; padding-left: 9999px; 。 但是我仍然想知道是否有更合適的方法來做到這一點。

更新：

我能夠提出一個更好的解決方案，其中涉及偽元素，請參見下文。 感謝@Paulie_D的提示！

Answer 1

看起來最好的選擇是使用偽元素 。 以下CSS代碼將出血應用於左側列。

.column { position: relative; }
.column:before { 
    content: ""; 
    position: absolute; 
    top: 0; 
    bottom: 0; 
    width: 100%; 
    right: 100%;
}

請參閱實際使用中的列出血 。 有關更多信息，請參見本文 （感謝@Paulie_D）。

如果有人有，我很樂意選擇一個更好的解決方案。