向 p 标签添加填充不起作用，而它对类起作用答案

【问题标题】：Adding padding to p tag not working, while it does with a class向 p 标签添加填充不起作用，而它对类起作用
【发布时间】：2022-06-22 02:43:48
【问题描述】：

当我在 <p> 标记中包含填充时，它不起作用。但是，当我尝试将其添加到功能盒类时，它可以完美运行。

<section id="features">
    <div class="row">
      <div class="feature-box col-lg-4 ">
          <i class="fa-solid fa-circle-check "></i>
          <h3>Easy to use</h3>
          <p >So easy to use, even your dog< could do it.</p>
      </div>
      <div class="feature-box col-lg-4">
          <i class="fa-solid fa-bullseye"></i>
          <h3 >Elite Clientele</h3>
          <p >We have all the dogs the greatest dogs.</p>
      </div>
      <div class="feature-box col-lg-4">
          <i class="fa-solid fa-heart"></i>
          <h3>Guaranteed to work</h3>
          <p>Find the love of your dog's lifeyour money back.</p>
      </div>
  </div>
</section>

【问题讨论】：

标签： html css

【解决方案1】：

您的问题非常不清楚，但请尝试将其添加到您的 css 中：

p {
  padding: 2em;
}

【讨论】：

【解决方案2】：

你的问题很不清楚，也许你需要在你的 p 标签顶部和底部添加一些填充，然后添加我的代码它会完美地工作......

p{
  padding: 20px 0;
}

   <div class="feature-box col-lg-4 ">
        <i class="fa-solid fa-circle-check "></i>
        <h3>Easy to use</h3>
        <p >So easy to use, even your dog< could do it.</p>
    </div>
    <div class="feature-box col-lg-4">
        <i class="fa-solid fa-bullseye"></i>
        <h3 >Elite Clientele</h3>
        <p >We have all the dogs the greatest dogs.</p>
    </div>
    <div class="feature-box col-lg-4">
        <i class="fa-solid fa-heart"></i>
        <h3>Guaranteed to work</h3>
        <p>Find the love of your dog's lifeyour money back.</p>
    </div>
</div>

【讨论】：

【解决方案3】：

看看下面的代码：

.feature-box p {
  padding: 20px;
}

<section id="features">
    <div class="row">
      <div class="feature-box col-lg-4 ">
          <i class="fa-solid fa-circle-check "></i>
          <h3>Easy to use</h3>
          <p >So easy to use, even your dog< could do it.</p>
      </div>
      <div class="feature-box col-lg-4">
          <i class="fa-solid fa-bullseye"></i>
          <h3 >Elite Clientele</h3>
          <p >We have all the dogs the greatest dogs.</p>
      </div>
      <div class="feature-box col-lg-4">
          <i class="fa-solid fa-heart"></i>
          <h3>Guaranteed to work</h3>
          <p>Find the love of your dog's lifeyour money back.</p>
      </div>
  </div>
</section>

【讨论】：

【解决方案4】：

请检查以下代码：

p {
  padding: 50px;
}

<section id="features">
      <div class="row">
        <div class="feature-box col-lg-4">
          <i class="fa-solid fa-circle-check"></i>
          <h3>Easy to use</h3>
          <p>So easy to use, even your dog could do it.</p>
        </div>
        <div class="feature-box col-lg-4">
          <i class="fa-solid fa-bullseye"></i>
          <h3>Elite Clientele</h3>
          <p>We have all the dogs the greatest dogs.</p>
        </div>
        <div class="feature-box col-lg-4">
          <i class="fa-solid fa-heart"></i>
          <h3>Guaranteed to work</h3>
          <p>Find the love of your dog's lifeyour money back.</p>
        </div>
      </div>
    </section>

【讨论】：