在Wordpress中添加水槽到基礎

我開始從基礎3的代碼上運行的Reverie的基礎設計Wordpress主題。我之前已經創建了主題，但我試圖讓我的頭腦圍繞網格方法，特別是如何最好地實現排水溝。在Wordpress中添加水槽到基礎

問題：

看到這裏我的測試網站http://diskbacker.com/

我有內容的div和側邊欄DIV與背景顏色來顯示問題。他們默認情況下彼此接觸。

如何在content div和sidebar div之間添加分隔符？
如何將內部填充添加到內容和側邊欄？
由於我要'快速響應'，這種分離會在移動設備上造成問題嗎？

在此先感謝。

來源

2013-01-21 Sara44

如果你把另一分區內列工程...

<div class="four columns"> 
<div style="margin:25px; background: #ccc;">test</div></div> 
<div class="eight columns">eight</div>

您還可以查看該類.panel的基礎，並適應您的特定需求：

.panel { background: #f2f2f2; border: solid 1px #e6e6e6; margin: 0 0 22px 0; padding: 20px; } 
.panel > :first-child { margin-top: 0; } 
.panel > :last-child { margin-bottom: 0; }

或者 - 使用粉底v2

來源

2013-03-06 14:48:11 iamrobert

我會首先推薦，閱讀ZURB Foundation文檔，它解釋了電網的使用：

http://foundation.zurb.com/docs/grid.php

排水溝被簡單地列上創建填充。這意味着列具有簡單的寬度，例如25％或50％。調整填充可調整排水溝，並且可以通過Scss 變量，下載自定義程序或通過CSS本身來控制此排水溝。

與任何HTML/CSS網站，你可以識別，選擇您要修改的元素，並在您的自定義CSS樣式表，發現填充該元素，如：

.sidebar {padding:14px;}

希望這有助於。

來源

2013-01-23 09:26:49

不幸的是，這是我第一次嘗試。如果你有Firebug或類似的，你可以在示例網站上試用它，但它不起作用。只在子div上添加填充工作（例如post-box）。我想在繼續之前檢查這是正確的方法。 – Sara44

在Wordpress中添加水槽到基礎

回答

相關問題