css - 親に相対的ではないパディングのパーセンテージ %

Question

私はこのHTMLを持っています

<div class="box">
   <div class="box-header">
     <h4 class="box-header-title">CONTENT</h4>
   </div>
   <!-- rest of box -->
</div>

そして、私はこのCSSを持っています:

.box {
  display: inline-block;
  min-width: 360px;
  position: relative;
}
.box-header {
  color: #fff;
}
.box-header-title {
  padding: 0 2%;
}

私が欲しいもの：代わりに.box.header-title現在の幅に応じてパディングを調整すること.box-header-title.box

現在、.boxが500px計算値の場合、パディングは で計算され10pxます。親ボックスではなく、要素の現在の幅で計算したい。

Answer 1

なぜあなたはしようとしないのですか、

position:absolute;

そして、適切な上と左の値を与えます。