1

我目前在我的页面上有两个关于左中的 div，它们都向左浮动。我的问题是，当我调整页面大小以使其更小时，右 div 会下沉到左 div 之下，我希望它保持在另一个 div 旁边的位置。

什么 CSS 魔法可以让我做到这一点？（如有）

4

3 回答 3

0

在开发流体布局时，一个常见的错误是将%单位与px值混合。

的大小与可用空间相关，当存在带有或或%的值时无法有效工作pxem...

如果您使用%单位来调整布局的大小，您必须确保，您必须%为所有border, padding, margin.

对于这样的布局

<div id="left">
    Left
</div>
<div id="center">
    Center
</div>

CSS，

#left, #center { float: left; }
#left { width: 26%; padding: 2%; }
#center { width: 66%; padding: 2%; }
于 2013-03-01T05:22:34.803 回答
0

您好，请检查以下相应的代码，它会帮助你....

<html>
    <head>
        <style type="text/css">
            #left {
                border:1px solid red;
                width:40%;
                height:auto;
                float:left;
            }
            #right {
                border:1px solid blue;
                width:40%;
                height:auto;
                float:left;
            }
        </style>
    </head>
    <body>
        <div id="left">
            <h1>Sample 1</h1>
            <h1>Sample 1</h1>
            <h1>Sample 1</h1>
            <h1>Sample 1</h1>
        </div>
        <div id="right">
            <h1>Sample 2</h1>
            <h1>Sample 2</h1>
            <h1>Sample 2</h1>
            <h1>Sample 2</h1>
        </div>
    </body>
</html>
于 2013-03-01T05:25:33.963 回答
0

还有一种方法可以在不使用 % 大小的情况下做到这一点，因为它们很危险；）

<div id="left">Left</div>
<div id="center">Center</div>
<br />

和CSS：

#left {
    width: 100px;
    float: left;
}

#center {
    width: 100px;
    margin: 0 auto;
}

br {
    clear: both;
}

所有最美好的祝愿，

穆罕默德·阿里·夏帕桑

于 2013-03-01T07:17:12.593 回答