如何在容器內部創建左側和右側？

我有什麼是側邊欄和右側我有內容。我想要的是雙方都在容器中，但都是全寬。這是我的演示：https://jsfiddle.net/DTcHh/19067/如何在容器內部創建左側和右側？

所以我想左邊的背景顏色從頁面的beging開始，但裏面的文本是在容器中，我也希望背景顏色的正確的內容去頁面結束，但文本是在容器中。任何建議？

<div class="container"> 
    <div class="col-md-3"> 
    <div class="left_sidebar"> 
    menu 
    </div> 

    </div> 
    <div class="col-md-9"> 
    <div class="right-content"> 
    content 
    </div> 

    </div> 
</div>

來源

2016-04-08 None

你能提供一個示例圖像顯示想要的結果嗎？ – Aides

當然...等一下 – None

@助手在那裏我顯示你的簡單圖像 – None

其簡單，包裹container類以上有色容器和使用兩個不同的容器：

<div class="left_sidebar"> 
    <div class="container"> 
     <div class="col-md-3"> 
      menu 
     </div> 
    </div> 
</div> 
<div class="right-content"> 
    <div class="container"> 
     <div class="col-md-9"> 
      content 
     </div> 
    </div> 
</div>

這裏是一個工作Fiddle

時被刪除的編輯，因爲編輯3應該做的絕招

E DIT 3

這是，現在肯定是這樣。這個技巧是通過linear gradient以及引導容器上方的自定義容器完成的。

見Fiddle

來源

2016-04-08 09:26:22 Roman

我需要有容器中的內容 – None

看到我的編輯2，希望這是你想要的 – Roman

嗯它不是我想要的..我想要一個容器 – None

-1

使用類排山坳格前

<div class="row"> 
<div class="col-md6"></div> 
<div class="col-md-6"><div> 
</div>

來源

2016-04-08 09:29:36

什麼你問，在默認情況下是不可能的，因爲.container類有不同的視口一組寬度，它也是橫向「居中」margin:auto。

要實現你所嘗試的，你將不得不遵循不同的「邏輯」。我建議是這樣的：

<div class="left-sidebar col-md-3"> 
    <div class="sidebar-menu col-xs-6 pull-right"> 
     menu 
    </div> 
</div> 
<div class="right-content col-md-9> 
    <div class="content-text col-xs-10> 
     content 
    </div> 
</div>

我爲了留在同一個「流」爲您的代碼propse此解決方案。你也可以，只是玩填充，這更有意義。

來源

2016-04-08 10:20:32

如何在容器內部創建左側和右側？

回答

相關問題