Question

我在我的主页的博客部分工作，并且在格式化方面存在问题。我想在同一行（并排）中显示两个块，我希望该行保持在页面的正常流程中。为此，我在容器盒中放置了两个盒子。相关代码：

＆＃13;

#container1 {
  display: block;
  position: static;
  margin-bottom: 20px;
  border-width: 1px;
  border-style: solid;
}
#pgPhoto {
  padding: 10px;
  display: inline-block;
  width: 20%;
  border-width: 10px;
  border-style: outset;
}
#statement {
  padding-left: 30px;
  padding-right: 30px;
  display: inline-block;
  float: right;
  border-width: 10px;
  border-style: outset;
}
#post1 {
  display: block;
  border-width: 10px;
  border-style: outset;
}

＆＃13;

<div id="container1">
  <div id="pgPhoto">
    <!--this is just a box right now-->
  </div>

  <div id="statement">

    <p1>
      <em class="bold">Statement:</em> Some Text
    </p1>

  </div>
</div>

<div id="post1">

＆＃13;

post1块在浮动时与上面的框重叠。根据我的理解，这是正常的，因为它们已经从正常流程中取出，并且绕过这个方法是制作一个包含两个并排盒子的容器盒。但似乎浮动容器块内的盒子也会使容器块脱离流动？也是＆＃34;显示：内联块;＆＃34;应该让积木并排展示？因为我无法正常工作。

CSS Box格式 - 重叠问题

0 个答案: