程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> 更多編程語言 >> 編程綜合問答 >> 瀑布流-關於CSS子級float,父級高度變化的問題

瀑布流-關於CSS子級float,父級高度變化的問題

編輯:編程綜合問答
關於CSS子級float,父級高度變化的問題

網頁結構說明:

<body>
  <div id="header">...</div>
    <div id="main">
            <div id="left" class="fleft">...</div>
            <div id="middle" class="fleft">
                    <div id="mtop">...</div>
                    <div id="mview"><!---->
                            <div class="box"></div>
                            <div class="box"></div>
                            <div class="box"></div>
                            <div class="box" style="position:absolute;top: ... ;left: ... ;"></div>
                            <div class="box" style="position:absolute;top: ... ;left: ... ;"></div>
                            <div class="box" style="position:absolute;top: ... ;left: ... ;"></div>
                            <div class="box" style="position:absolute;top: ... ;left: ... ;"></div>
                            <div class="box" style="position:absolute;top: ... ;left: ... ;"></div>
                            <div class="box" style="position:absolute;top: ... ;left: ... ;"></div>
                            ......
                            .....
                            ....
                            ...
                            <div class="box" style="position:absolute;top: ... ;left: ... ;"></div>
                    </div>
            </div>
            <div id="right">...</div>
    </div>
    <div id="footer">...</div>
</body>

<!--
box的style由jquery添加的;
#main { width:960px;overflow: hidden; margin:0 auto;background:url(imgs/bg_content.png) repeat-y right; }
#middle {width: 560px;padding: 20px;position: relative;overflow: hidden;}
#mview {position: relative; overflow: hidden;}
.box {padding: 10px 0 0 10px;float: left;}
.fleft{float:left;}
-->

我想在mview裡面做一個局部的瀑布流效果,讓每個box瀑布一樣的布局。現在jquery也寫好了,mview卻只顯示的一小部分(就第一行的高度那麼高),其他的顯示不出來,我在網上查了查,沒有找到解決辦法。誠請達人指點指點。謝謝

最佳回答:


瀑布流裡面的元素是absolute定位不占用空間的,所以你的mview對象只有默認的高度。。你需要在你的瀑布流計算完畢後,獲取最後一行的元素計算下這個元素的高度+top位置,重設下mview的高度才行

showbo
u013182001
  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved