首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >css浮动和填充

css浮动和填充
EN

Stack Overflow用户
提问于 2011-02-16 15:31:47
回答 3查看 62.2K关注 0票数 22

这是HTML布局:

代码语言:javascript
运行
复制
        <div class="wrap">
           <div id="container">
               <div id="left">...</div> 
               <div id="right">...</div> 
            </div>
        </div>

我在左边的分区中使用float: left,在右边的分区中使用float: right。然后,我使用了容器的padding-top: 10px。为什么不动呢?谢谢。

这是我的第一个风格:

代码语言:javascript
运行
复制
.wrap {
    float: left;
    width: 1000px
}

#container{
    background-color: #FFFFFF;
    padding: 10px 10px 0;
    width: 980px;
    float: left;
}

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

#right {
    float: right;
    width: 300px;
}

Example here

EN

回答 3

Stack Overflow用户

回答已采纳

发布于 2011-02-16 15:36:23

当您浮动一个元素时,它实际上是将它从文档流中移出,因此向它的父元素添加填充不会对它产生影响。您可以在两个内部div上都使用margin-top: 10px;

票数 30
EN

Stack Overflow用户

发布于 2011-02-16 16:11:16

将右浮动div放在浮动左div之前

票数 1
EN

Stack Overflow用户

发布于 2021-11-23 08:48:49

使用flex并对齐内容之间的空格,而不是使用浮动

代码语言:javascript
运行
复制
 #container{
  background-color: #FFFFFF;
  padding: 10px 10px 0;
  width: 980px;
  display: flex;
  justify-contents: space-between;
 }
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/5013683

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档