定位 HTML/CSS 元素时出现问题

Question

我需要你们的帮助，伙计们我试过了float，display:inline-block但没有任何效果。他们继续按照他们想要的方式移动，而不是按照我想要的方式移动，如果你明白我的意思的话。那么我应该如何解决这个问题呢？

Answer 1

.block {

  width: 200px;

  height: 200px;

  border: 1px solid black;

}

.block2{

  position: absolute;

  right: 0;

  top:0;

}

.block3 {

  height: 400px;

  float:right;

}

    <div class="block1 block"></div>

    <div class="block2 block"></div>

    <div class="block3 block"></div>

Answer 2

您可以使用display: flex;财产。这可以给出您预期的结果。首先用div一个div. 然后将该父 div 的显示设置为 flex。无需使用absolute位置。

<div class="block">

    <div class="child-left">Left side contents</div>

    <div class="child-right">Right side contents</div>

</div>

.block {

     display: flex;

     justify-content: space-between;

}