Divs拒绝充当块元素

Question

＆＃13;

＆＃13;

.useless {
	float: right;
	clear: right;
	border: 1px dashed blue;
	height: 50px;
	width: 100%;
}
div.pretraga {
	border: 3px groove red;
	width: 20%;
	float: right;
	margin-right: 5%;
	border-top: 0;
	display: flex;
	justify-content: center;
	height: 250px;

＆＃13;

<div class="pretraga">
  <div class="useless">
  </div>
  <div class="useless">
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;

我在div中有2个div，它们拒绝充当块元素。出于某种原因，它们是在线显示的，而不是在彼此之下。你能解释一下这是什么原因，而不仅仅是如何解决它？ 较大的div具有宽度和高度设置。 较小的div也有其尺寸设定。 显示：块用于所有3个div。 我尝试使用浮动，没有工作。 我尝试使用clear和float，没有工作。 唯一可行但却非常糟糕的是给予他们每个人的位置：亲戚。

你不需要向我提供代码，只是请尝试解释为什么会发生这种情况，一般问题是什么，以及如何解决这个问题，因为对我来说，作为一个初学者，它并没有＃39有意义的是，他们有时会在对方下方互相展示，有时彼此相邻。

Answer 1

这是因为你在父节点上使用flex - flex父节点的子节点的默认值是彼此相邻对齐，移除flex并且它将起作用。

我还会说，由于您的孩子宽度为100％，因此无需浮动，因此您也可以将其删除

.useless {
  border: 1px dashed blue;
  height: 50px;
  width: 100%;
}

div.pretraga {
  border: 3px groove red;
  width: 20%;
  float: right;
  margin-right: 5%;
  border-top: 0;
  justify-content: center;
  height: 250px;
}

<div class="pretraga">
  <div class="useless">
  </div>
  <div class="useless">
  </div>
</div>

More information about flexbox

Flexbox playground (codepen)