問題浮動：對多列布局正確嗎？

Question

我想把內容li放在2列中，並想使用float:right; 在fieldset ，但是此float在顯示列is中造成了問題。 如何使用float:right ，這個問題可以解決？

示例： http ： //jsfiddle.net/w2XWu/

ol#hi{
    -o-column-count: 2;
    -icab-column-count: 2;
    -khtml-column-count: 2;
    -moz-column-count: 2;
    -webkit-column-count: 2;
    column-count: 3;
    -o-column-rule: 1px solid black;
    -moz-column-rule: 1px solid black;
    -webkit-column-rule: 1px solid black;
    column-rule: 1px solid black;
}
fieldset {
    background-color: #EEF3F7;
    position: relative;
    float: right;           /*problem is this line*/
    direction: rtl;
    border-radius: 5px;
    border: 1px solid #EAEAEA;
    margin: 10px 5px 0 0;
    display:inline;
}


<fieldset>
    <legend>
    hi </legend>
    <div class="find_input mediumCell">
        <div class="column">
            <ol id="hi">
                <li>Hello</li>
                <li>how</li>
                <li>what</li>
                <li>Normalized</li>
                <li>Mootools </li>
                <li>CSS</li>
                <li>attributes </li>
                <li>More </li>
                <li>Library</li>
                <li>Choose </li>
                <li>Please </li>
                <li>Framework</li>
            </ol>
        </div>
    </div>
</fieldset>

Answer 1

您可以通過添加width:100%;來修復它width:100%; （或您希望字段集為任意寬度）為您的字段集樣式

示例： http ： //jsfiddle.net/DyU9S/1/

更新

發生這種情況的原因：

您已將字段集顯示設置為inline ，因此字段集將僅增長到您告訴它的寬度，或者僅占用其最小空間。 如果您希望它增長到100％，請制作顯示block或inline-block 。 除此之外，選擇您希望字段集為的寬度，它將是該寬度。