相對div內絕對定位的div不想擴展更多的內容

我有我的＃內容div和#box_left和#box_right裏面。父div是相對定位的，但兩個內部div都是絕對定位的。問題是#box_right在內部有更多內容時不想擴展其高度。我也希望那些內部div使靜態和浮動並排設置它們，但是內容消失，然後即使我已經設置明確：都在#footer div。另一個小問題：你知道菜單鏈接拉伸的原因，當頁面按屏幕分辨率縮放時，最後一個鏈接將進入第二行嗎？相對div內絕對定位的div不想擴展更多的內容

這裏是鏈接到我的網站：CLICK HERE

希望得到任何幫助！日Thnx提前

來源

2012-01-18 lukaleli

你#wrapper指定DIV得到它250集的高度加載網頁時點擊時不會改變你的鏈接「中去」。 – j08691 2012-01-18 22:05:39

如果不會延長框的內容是浮動的，你需要一個額外的div後他們：

<div id="content"> 
    <div id="box_right" style="margin-left:200px;"></div> 
    <div id="box_left" style="float: left; width: 200px;"></div> 
    <div style="clear:both;"></div> 
</div>

來源

2012-01-18 21:56:55 circusdei

頁腳後面有這個屬性，它不工作：/ – lukaleli 2012-01-18 22:00:01

必須是浮動的兄弟姐妹。編輯。 – circusdei 2012-01-18 22:00:30

仍然不能正常工作：/ – lukaleli 2012-01-18 22:05:55

-1

就個人而言，我真的試圖在一些使用絕對定位「主對象「。在佈局行的第一個div上使用「clear：both; position：relative; float：left;」，position：relative; float：left;「對於其餘的人來說很好地從左到右排列。使用「display：block;」在子元素上「適合」對象尺寸的內容。

有關對象定位尼斯教程：div boxes

來源

2012-01-18 22:04:28 Adi

擺脫你的「高度：100％」的#box_right和＃內容 - 他們不幫助你。

相反，將#content div上的最小高度設置爲稍大於#box_right div，您應該笑了。刪除100％高度後，我將#content的最小高度設置爲1000px（全部使用Chrome中的檢查器）並正確渲染。

我也快速瀏覽了你的javascript - 你應該將所有的jQuery選擇器存儲爲變量而不是重新查詢它們 - 它會更快。所以你的document.ready處理程序應該寫得更像這樣：

$(function() { 
    var $content = $("#content"); 
    var $footer = $("#footer"); 

    $content.hide(); 
    // etc 

    $("a", $footer).click(function() { 
     $footer.animate({ marginTop: "none" }, 1000); 
     // etc 
    }); 

    // etc 
});

希望有所幫助。

來源

2012-01-18 22:21:27 gerrod

感謝您的幫助和提示！ – lukaleli 2012-01-18 22:46:31

-1

使用基於浮點的佈局除非您有足夠的理由使用絕對值，否則您只會導致自己的問題。

更新：絕對定位的元素從文檔的流程中取出。清除將不起作用。清除僅影響浮動元素，這是你應該使用的。或者，查看flexbox，它很棒，但有其自身的複雜性。

solved-by-flexbox

來源

2012-01-19 00:12:41

相對div內絕對定位的div不想擴展更多的內容

回答

相關問題