Question

我不确定自己的位置不足，但我无法弄清楚为什么我的两个div不会相互浮动。

我在这里创建了一个jsfiddle：http://jsfiddle.net/Q3XUy/

<body>
<div class="container">
        <div class="nav">
            <nav>
                <ul>
                    <li><a href="/">Home</a></li>
                    <li><a href="/about">About Me</a></li>         
                    <li><a href="/contact">Contact</a></li>
                </ul>
            </nav>
        </div>
        <div class="contentImage">
            <img src="RD.png" />
        </div>
        <div class="content">
            <p>
                Pinterest Banksy 90's organic salvia....
            </p>
        </div>
    </div>
</body>

谢谢！

Answer 1

你在其中一个div上的填充权限正在使它们加起来超过100％并且换行。您可以采用不同的方式，例如在50％div中放置一个较小的div会导致麻烦。

Answer 2

有时，当您设置宽度百分比时，浏览器会将其解释为大于100％的数字并换行。此外，任何添加的填充都会触发它。

考虑：

.contentImage {
    width: 49.5%;
    padding: 0;
}

.content { width: 49.5%; }

两个div不会相互浮动

2 个答案: