html - 减少 radio 标签行之间的空间

Question

我有一个单选按钮，它有两行作为标签。行与行之间的空格有两个，我想减少它们。

这是我的代码:

          <label for="reg-promo">
            <input type="radio" name="promotion" id="registerPromo" v-validate="'required'" checked="checked"
              v-model="registerPromo" value="reg-promo" />
            <span>
              <b>Welcome Offer</b>
              <p id="welcomeOfferSubtext">$35 in credits available</p>
            </span>
          </label>

welcomeOfferSubtext 只是简单地在段落左侧添加 28px 内边距:

#welcomeOfferSubtext {
    padding-left: 28px;
  }

现在看起来像这样:

但我希望它看起来像这样:

修复它的最佳方法是什么？

附言

请忽略句子差异。重点是间距 我不想使用 CSS 中的 line-height

Answer 1

额外的垂直空间可能来自其他(或浏览器默认)<p> CSS。

或者改变<p id="welcomeOfferSubtext">至 <div id="welcomeOfferSubtext">

或者添加到你的CSS:

#welcomeOfferSubtext {
    padding-left: 28px;
    margin: 0; // add this line
  }