两个div并排?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (11)

试图放置两个div并排,并使用以下CSS。

#left {
  float: left;
  width: 65%;
  overflow: hidden;
}

#right {
  overflow: hidden;
}

HTML很简单,包装器div中有两个左右div。

<div id="wrapper">
  <div id="left">Left side div</div>    
  <div id="right">Right side div</div>
</div>

提问于
用户回答回答于

或者尝试下

#wrapper {
  display: flex;
}
#left {
  flex: 0 0 65%;
}
#right {
  flex: 1;
}
用户回答回答于

案例

试一试:

HTML:

<section class="container">
    <div class="one"></div>
    <div class="two"></div>
</section>

CSS:

.container {
    width: 80%;
    height: 200px;
    background: aqua;
    margin: auto;
    padding: 10px;
}
.one {
    width: 15%;
    height: 200px;
    background: red;
    float: left;
}
.two {
    margin-left: 15%;
    height: 200px;
    background: black;
}

扫码关注云+社区