css列縮小100％像素值

我有一個頁面被分成3個div，左中和右。我不想在左側和右側顯示任何內容，他們只是構成頁面。css列縮小100％像素值

#leftDiv 
{ 
    background-color: Gray; 
    width: 10%; 
    left: 0px; 
    top: 0px; 
    position: absolute; 
    height: 100%; 
} 

#rightDiv 
{ 
    background-color: Gray; 
    height: 100%; 
    width: 10%; 
    left: 90%; 
    top: 0px; 
    position: absolute; 
    clear:both; 
}

中心div有一個表格，它允許用戶選擇要查看的行數。如果他們選擇了一個大的值，那麼表格的主體超出了左右分區的底部。

要糾正這一點，我把下面的代碼在

if ($("#leftDiv").length == 1) { 
       $("#leftDiv").height($("body").height() + "px"); 
      } 
      if ($("#rightDiv").length == 1) { 
       $("#rightDiv").height($("body").height() + "px"); ; 
      }

，直到用戶選擇一個較大的值之後，選擇比頁面大小更小的值，這工作正常。然後左右div設置爲小於100％。我需要的是一種方法來找出什麼是100％的像素，然後我可以比較這與身體的高度，並決定哪個更大。

任何想法？

感謝

約翰

來源

2009-11-16 John

使用margin: 0 auto

殺死你的左，右列，給你的主要DIV的寬度，然後該div使用自動左右邊界中心。例如：

#mainDiv { 
    width: 80%; 
    margin: 0 auto; 
}

來源

2009-11-16 16:13:36

所有三種解決方案都有問題，我的mainDiv/content/center_div沒有調整到窗口的100％。因此，我在頁面的大小和半途上都有灰色背景。我已將最小高度設置爲100％，但似乎並不重要。我正在創建一個在不同頁面上具有不同內容的嚮導。 – John 2009-11-17 09:05:40

將背景放在''標記或其他外部div上。 – 2009-11-17 14:48:25

如果左邊和右邊的div沒有任何內容，那麼就沒有必要對它們進行單獨的div：運用他們的格式，以您的div容器，而是和中心您的內容DIV使用margin: 0 auto 。很明顯，你需要給容器div指定寬度和非透明背景。然後，您可以讓瀏覽器根據需要調整窗口大小 - 您無需爲該部分重新創建輪子。

CSS：

#container {background-color:gray;} 
#content {background-color:white;width:80%;margin:0 auto;}

HTML：

... 
<body> 
<div id="container"> 
<div id="content"> 
...your content here... 
</div> 
</div> 
</body> 
...

（如果您的網頁沒有一個div容器，那麼你可以申請的背景色爲主體元素，而是和節省更多代碼）。

來源

2009-11-16 16:15:53 Martha

爲什麼要創建空元素來構建頁面？如何設置body背景，你需要的顏色和：

#center_div {width: /* whatever */; 
      margin: 0 auto; /* to center in the viewport */ 
      overflow: auto; /* or visible */ 
}

你可以離開關overflow屬性，簡單地代替width使用min-width（我不記得，跨瀏覽器的兼容性如何，這是）定義「正常」寬度，以這種方式內容將強制div按需顯示內容。

來源

2009-11-16 16:16:28

我確實希望人們會停下來並偶爾解釋反對票。踢球。這樣我就能在我的答案中瞭解什麼是誤導或錯誤的。 – 2009-11-19 00:25:46

css列縮小100％像素值

回答

相關問題