如何將2個div放在eachother旁邊，當頁面大小調整時只有1個卷軸？

我現在有這樣的設置：如何將2個div放在eachother旁邊，當頁面大小調整時只有1個卷軸？

------------- 
|nav| data | 
|nav| data | 
|nav| data | 
|nav|  | 
-------------

（NAV =導航; - ，| =頁的大綱）

當我把我的布勞爾窗口小我希望它看起來是這樣的：

----------- 
|nav| dat| 
|nav| dat|  
|nav| dat| 
|nav|scrol|  
-----------

（scrol =滾動條），但我所得到的是這樣的：

----------  OR  ----------- 
|nav| dat|a    |nav| 
|nav| dat|a    |nav| 
|nav| dat|a    | data | 
|nav| dat|a    | data | 
----------    -----------

我的數據內容不在我的頁面範圍內。

我想我的滾動條只有在「數據」格

我已經使用浮動，表格，溢出，位置，...嘗試各種東西我當前的代碼：

<div > 
    <div id="PlaceHolder" runat="server" style='float:left;width:200px;'> 

    </div> 
    <div id="facet_results" style="float:left;width:900px;" > 
      <table ID="tblResults"> 
      <table> 
    </div> 
</div>

這是確定的，但當我的頁面寬度低於1100px'結果'div結束低於'佔位符'div

任何人都可以幫助嗎？感謝

來源

2011-08-10 gen

我認爲這可能幫助你：http://cameronmoll.com/archives/000892.html

雖然它不是最描述的事情，但至少有到頁面的鏈接，在使用http://tuscany.cssmastery.com/

EDIT2是黑客： http://jsfiddle.net/CV8kv/簡化和多一點指定，以滿足您的需求。

編輯：也許我誤解了你的例子。

當瀏覽器窗口減少時，是否希望內容區寬度發生變化？

如果不檢查了這一點http://jsfiddle.net/jzzgu/

這裏

主要的一點是，你包裝你的元素中元素（在這種情況下<div id="wrap">），然後給那就是網站的主要寬度元素的寬度#wrap { 600px; }和當你把東西放進去時。瀏覽器將把它當作..它是什麼......當你擁有更大或更小的眉毛窗口時，內部的東西不會受到影響。

來源

2011-08-10 08:51:42 Joonas

不正是我要找的。是的，我想要改變內容寬度。在遊戲的示例頁面中，我希望「Lavish Luxury，無與倫比的舒適度」div保持設置的大小，右邊的div變小，當它小於900px時，應該在該div內彈出一個滾動條（不是在導航或整個頁面） – gen

@gen嗯，它應該更像是一個推向正確的方向，而不是單詞到字的解決方案。看看我的更新。 – Joonas

恐怕這仍然不是我想要的解決方案。但我已經得出結論說，它不按照我想要的方式進行工作。謝謝 – gen

這是你想要的東西：

<html> 
<head> 
    <style> 
     body { margin: 0px; } 
     #nav { 
      position: absolute; 
      left: 0; top: 0; 
      background: #ffffaa; 
      width: 200px; 
     } 
     #body { 
      margin-left: 200px; 
      background: #aaffaa; 
      overflow-x: scroll; 
     } 
     #inside_body { 
      width:900px; 
     } 
    </style> 
</head> 
<body> 
    <div id="nav"> 
     Some Text Some Text Some Text Some Text Some Text Some Text Some Text Some 
     Some Text Some Text Some Text Some Text Some Text Some Text Some Text Some 
    </div> 
    <div id="body"> 
     <div id="inside_body"> 
      Some Text Some Text Some Text Some Text Some Text Some Text Some 
      Some Text Some Text Some Text Some Text Some Text Some Text Some 
     </div> 
    </div> 
</body> 
</html>

來源

2011-08-10 09:00:43 nobody

（hehe回覆沒有人）這工作，但有沒有辦法做到這一點沒有位置：絕對？因爲這會讓導航div跳出頁面。 – gen

@gen你是什麼意思它跳出頁面？它不在我的瀏覽器中。 – nobody

我有一個圍繞導航和數據背景的div。當我添加絕對位置時，背景不會再隨着導航高度一起調整大小。這將是我的CSS設置錯誤呢？ – gen

如何將2個div放在eachother旁邊，當頁面大小調整時只有1個卷軸？

回答

相關問題