Is there a way to specify "initial" values in css shorthands like padding?

Question

Say I have a complex stylesheet with lots of interacting styles etc.

For a specific class, I want to override padding-top and padding-bottom, without changing the values of padding-left and padding-right (which might even be different things for different elements that get the class I'm specifying).

Is there a way to do this with a shorthand, something like

.special {
    padding: 10px initial 5px;
}

that leaves the previous values, or do I have to spell out my css like this:

.special {
    padding-top: 10px;
    padding-bottom: 5px;
}

Thanks.

Answer 1

Well if you know that the left and right padding will always be the same number, you could write it like:

.special {padding:10px 5px 10px 5px;}

Answer 2

No you can't use something like 'initial', you should use padding-top and padding-bottom.

Answer 3

You'd have to specify it as in your second example, it's possible that the browser would interpret inherit in some means:

.special {padding: 10px inherit 5px inherit; }

but the inherited values would come from the parent element of .special, not necessarily the 'default' values.

---

Edited in response to comment:

inherit can only be used as replacement for the value, not in place of a length (from "CSS: The Definitive Guide": values: [ | ]{1,4} | inherit. @Lekensteyn

In consequence, then, it would be required to specify the values long-hand.

Answer 4

I don't think there is any way around spelling it out. Sorry.

Answer 5

Not without using one of the css frameworks that have sprung up like Less: http://lesscss.org/