Burdock
Burdock

Reputation: 1105

How to make compound styles

I would like to make some compound style values for example: height:100%-10px;

Is there some way to do this with CSS?

Or do you have to use JavaScript?

If so can you post your suggestions?

Upvotes: 3

Views: 94

Answers (1)

Josh Crozier
Josh Crozier

Reputation: 241198

You would use calc().

height: calc(100% - 10px);

jsFiddle example

w3.org 8.1. Mathematical Expressions: ‘calc()’

The calc() function allows mathematical expressions with addition (‘+’), subtraction (‘-’), multiplication (‘*’), and division (‘/’) to be used as component values. The ‘calc()’ expression represents the result of the mathematical calculation it contains, using standard operator precedence rules. It can be used wherever , , , , , or values are allowed. Components of a ‘calc()’ expression can be literal values, ‘attr()’ or ‘calc()’ expressions, or values that resolve to one of the preceding types.

Upvotes: 4

Related Questions