2014-01-06 8 views
12

他のクラスから幅を継承する方法はありますか?マイナス(またはプラス)pxのサイズですか?幅:継承マイナス(またはプラス)

これはcss適切ではなく、アイデアを得る:

width: inherit - 20px ; 

私は継承幅と、それは+ 20pxのためにボックスの外側を行く10pxパディングを使用していますので、

ライブ例:いいえCSSの継承は全くそのように動作しませんbox-sizing:border-boxDEMO

+0

この補完構造を使用している理由はわかりません。 –

答えて

15

また、(this jsfiddleを参照)calcを使用することができますが、私がkeiによってボックスのサイズ変更の方法は、あなたの特定のケースのために良いかもしれないと思います。

カルクのための重要な部分は、以下のとおりです。CALC hereため

position:relative; 
width: calc(100% - 18px); 

チェックをサポート。

+1

私はちょうどあなたの答えがいかに強力であるかを理解しました!スーパー!ありがとう! – masteringtaiwan

+1

@masteringtaiwan - 喜んで助けました。 – acarlon

+0

これをマージンにする方法はありますか?例えば、「margin-left:value」は、「margin-left:value + 10px」のホバーになります。値が10pxまたは20pxまたは30pxの場合もあります。 – nclsvh

1

を追加します。要素がプロパティを継承するとき、要素は常に親から(クラスからではなく)継承し、親のプロパティ値を継承します。

あなたがしていることを達成するには、(想定されている技術ではなく)本当に達成したいことを記述する必要があります。 2つの入れ子になったdiv要素を使用しています。両方とも同じクラスを共有していますが、おそらく余計です。

+1

ありがとうkei! Firefoxの改善されたソリューション: ボックスサイズ:border-box; -moz-box-sizing:border-box; – masteringtaiwan

関連する問題