0

下面的 html 看起来就像我在 VS 2010 设计视图中想要的那样，但是当我运行它并在 IE 8 中打开它时，它全部被顶起。蓝色和黄色是我所期望的，但红色比蓝色低 1/2，橙色位于最左下角。我在这里想念什么？

<div style="background-color: Aqua; height: 195px; width: 800px;">

    <div style="background-color: Yellow; display: inline-block; width: 18%; height: 100%; margin: 0px 5px 0px 0px;">
        <!--Freq holder-->
        <fieldset style="height:85%;">
            <legend>Frequency</legend><br />
            <input type="radio" name="freq" value="Daily" />Daily<br /><br />
            <input type="radio" name="freq" value="Weekly" />Weekly<br /><br />
            <input type="radio" name="freq" value="Monthly" />Monthly
        </fieldset>
    </div>

    <div style="background-color: Red; display: inline-block; width: 32%; height: 100%; margin: 0px 5px 0px 0px;">
        Date holder
    </div>

    <div style="background-color: Orange; display: inline-block; width:48%; height: 100%;">
        Repeat holder
    </div>

</div>
4

1 回答 1

1

float以下是在不使用or的情况下如何实现它positioning：

我所有的孩子 div都有：

.inline{
    display:inline-block;
    vertical-align:top; /* to put the divs top */
}

用一个font-size:0到父容器来删除divs之间的空白。

JSFiddle

于 2013-07-29T17:41:10.123 回答