html - 方形

Question

.products
{
  width: 100%;
  height: 500px;
  background: gray;
}

.box
{
  width: 250px;
  height: 300px;
  background: darksalmon;
  border: 1px solid #000;
}

<div class="products">
  <div class="box">
    <p>Ola</p>
  </div>
</div>

我希望段落出现在一个正方形内。代码显示 2 个 div 在一起。并且只显示段落内的内容。

这张图片说明了我想要的格式:

Answer 1

.products
{position:relative;
  width: 100%;
  height: 500px;
  background: gray;
}

.box
{p
  width: 250px;
  height: 300px;
  background: darksalmon;
  border: 1px solid #000;
}

<div class="products">

    <p>Ola</p>
  </div>
  <div class="box">
</div>