Question

<html>
    <head>
        <title>Float Issue in IE7</title>
        <style type="text/css">
            .right { float: right; }
            .left { float: left; }
            .clear { clear: both; }
        </style>
    </head>
    <body>
        <div class="right">
            <div class="right">Right Text</div>
            <br/><br/>
            <div class="right">Right Text 2</div>
        </div>                        
        <div class="left">Left Text</div>
    <br class="clear" />
</body>
</html>

问题是“左文本”显示在“右文本2”之后，而不是在IE7中与“右文本”保持一致。

我一直在寻找一个多小时并尝试了很多东西，但一直无法修复它。

任何帮助都会很棒。

感谢。

Answer 1

试试这段代码，你想要的是什么？

DEMO

<html>
    <head>
        <title>Float Issue in IE7</title>
        <style type="text/css">
            .right { float: right; }
            .left { float: left; }
            .clear { clear: both; }
        </style>
    </head>
    <body>

        <div class="right">Right Text</div>
        <br/>
        <div class="left">Left Text</div>
        <br class="clear" />
        <div class="right">Right Text 2</div>                           
    <br class="clear" />
</body>
</html>

IE7浮动问题包含儿童浮动

1 个答案: