應用位置：固定在一個div，同時保持自動寬度

我有一個打開的對話框窗口，它具有可調整的寬度和最大高度，從而實現滾動。我想在該對話框的頂部放置一個div（或多個元素，如果需要的話），這樣當我滾動時，div仍然可見。我也想要div的寬度來填充對話框的寬度。應用位置：固定在一個div，同時保持自動寬度

於是，我開始與一些基本的HTML標記：

<div id="dialog"> 
    <div id="dialogHeader"><div> 
    <div id="dialogContents"></div> 
</div>

在這一點上，dialogHeader的寬度會自動調節以適應對話框的寬度。但是，如果向下滾動dialogContents，dialogHeader將滾動出視口。

我在用「position：fixed;」標記dialogHeader時遇到了相反的問題現在，它保留在視口中，但其寬度縮小到其內容的寬度。

如果我將dialogHeader的寬度設置爲100％，那麼它會擴展到對話框的外部。

是否有任何技巧來實現這兩種效果？或者我需要使用jQuery監視對話框的寬度並自動調整dialogHeader的寬度？

下面是一個屏幕截圖，顯示了我的對話框頂部的元素，並將其位置設置爲固定。請注意，您可以看到綠色背景未覆蓋整個頂部。 enter image description here

是的。該對話框有一個滾動條。我已經編輯了該場景的截圖。 –

你可以把滾動條放在內容div而不是外部div上嗎？ –

潛在的。我只是認爲這將是阻力最小的路徑，因爲此應用程序中的所有對話框的對話框級別都設置了最大高度。限制對話框子集中的內容高度可能會導致潛在的雙嵌套滾動條/其他不規則性......只是好奇它是否可以首先這樣做。 :) –

將窗口內容單獨且絕對地放在窗口容器中，並使用overflow:auto來強制內容滾動而不是溢出/增長父窗口。

您可以在父上下文中放置任何頂部浮動元素。

注意，您可以隨意調整輸出窗口，以測試其大小如何調整。

2013-06-11 22:16:02

請參閱評論。他不想將滾動條移動到內容上，他希望將其保留在整個對話框中。 –

我改變了小提琴添加浮動搜索框，但如果這不是他正在尋找我完全誤解了這個問題嘿嘿。 –

回答