在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ 請(qǐng)教一個(gè)關(guān)于浮動(dòng)的問題

請(qǐng)教一個(gè)關(guān)于浮動(dòng)的問題

畫面如圖所示：

clipboard.png

畫面一個(gè)6個(gè)元素，用的是bootstrap格柵排版的，其實(shí)就是左浮動(dòng)。

每個(gè)元素里默認(rèn)都有一個(gè)下拉框，當(dāng)?shù)谝粋€(gè)下拉框選中某個(gè)選項(xiàng)之后會(huì)出現(xiàn)第二個(gè)，當(dāng)?shù)诙€(gè)下拉框選中某個(gè)選項(xiàng)之后會(huì)出現(xiàn)第三個(gè)，......

期望能達(dá)到如下圖所示，下面一排能靠左去顯示：

clipboard.png

請(qǐng)教大家有什么思路嗎？

注：因?yàn)楦駯抛隽隧憫?yīng)式，在不同分辨率的設(shè)備上每行個(gè)數(shù)不確定。

回答
編輯回答
朽鹿

w3c上定義了浮動(dòng)的規(guī)則
以下為第8第9條，可知向上的優(yōu)先級(jí)別比向左高，這里可以向上，因此不能向左了

A floating box must be placed as high as possible.
A left-floating box must be put as far to the left as possible, a right-floating box as far to the right as possible. A higher position is preferred over one that is further to the left/right.

解決方法，我一般是改用inline-block代替float的

2017年3月7日 12:54
編輯回答
神經(jīng)質(zhì)

可以換個(gè)思路，把銀行卡那幾個(gè)字相對(duì)定位，像貼標(biāo)簽一樣，貼在每一項(xiàng)上，不占據(jù)空間，就不會(huì)導(dǎo)致排版變亂

2018年2月2日 05:42
編輯回答
負(fù)我心

每一項(xiàng)固定高度吧，或者在5,9。。。項(xiàng)上加上清除浮動(dòng)的屬性

2017年12月10日 01:45
編輯回答
祉小皓

給每個(gè)box添加一個(gè)固定高度，然后給下拉框設(shè)置position: relative

<html><head><style>
        body {
            margin: 100px;
        }
        div {
            width: 200px;
            height: 200px; /* here!! */
            float: left;
            margin: 30px;
            background: #804528;
        }
        div p {
            position: relative; /* and here!! */
        }
    </style>
</head>
<body>
    <div>
        <p>aaaaa</p>
        <p>aaaaa</p>
        <p>aaaaa</p>
        <p>aaaaa</p>
        <p>aaaaa</p>
        <p>aaaaa</p>
        <p>aaaaa</p>
        <p>bbbbb</p>
    </div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</body></html>
2018年4月29日 21:06