Есть ли способ наследовать только один элемент сокращения CSS

Быстрый вопрос от новичка css здесь. Я пытаюсь уменьшить размер моих CSS файлов, используя сокращение для определенных свойств, таких как padding/marginins/etc. В некоторых случаях я хочу, например, указать margin-top, margin-left и margin-bottom, но наследовать margin-right. Я попробовал

margin: 10px inherit 11px 12px;

но это не работает, потому что ключевое слово inherit наследует все или ничего.

Есть ли способ отметить это как пропущенное и сделать что-то вроде

margin: 10px    11px 12px;
margin-right: inherit;

и знать, что я пропускаю одно значение в сокращении на 4 значения и не интерпретирую его как сокращенную 3-значную строку?

Кто-нибудь знает простой способ заставить это работать? Или я должен использовать длинные руки в тех случаях, когда я не указываю все четыре значения? Спасибо!

Ответ 1

Если вы перезапишите это значение, последнее объявление будет проигнорировано, поэтому вы можете просто сделать это:

element {
    margin: 10px 0 11px 12px;
    margin-right: inherit;
}

... где "0" здесь может быть любое значение * ^{см. ниже}.

Это не будет работать так, как вы ожидаете:

margin: 10px    11px 12px;

Это действительно приведет к следующим значениям:

margin-top: 10px;
margin-right: 11px;
margin-bottom: 12px;
margin-left: 11px; /* copied from margin-right value since it missing */

На всякий случай, обратите внимание, что inherit принимает любое значение для родительского элемента и не "reset" равно "по умолчанию", как принято считать. Итак, если это мгновенный ребенок чего-то с margin-right:100px, он наследует это значение. Это редкий случай, когда вы действительно хотите наследовать свойство, такое как margin, вы можете подумать, что он делает то, чего он действительно не делает.

EDIT. Как я уже сказал в комментарии, я не знал, что не могу использовать inherit в сокращении (по крайней мере, для поля) до тех пор, пока вы не поднимете этот вопрос, Я получаю некоторые довольно странные результаты здесь, и я честно не знаю, что с этим делать: http://jsfiddle.net/fpHb9/1/

Итак, пока кто-то еще не сможет прийти к лучшему пониманию этого поведения, будьте осторожны с этим. Может быть, лучше просто явно указать маржу.

EDIT2: Я думаю, что я решил тайну в демо. У меня нет ссылки, но кажется, что, поскольку inherit недействителен в сокращении, использование этого приведет к аннулированию всего объявления. Итак, что-то вроде этого не будет работать, как ожидалось:

margin:20px inherit 20px 20px; /* this line gets ignored completely */
margin-right:inherit;

Итак, чтобы изменить мое предыдущее выражение:

... где "0" здесь может быть любым допустимым значением ширины поля, как описано здесь:
http://www.w3.org/TR/CSS2/box.html#margin-properties.

Простите меня за длинный ответ, вы вызвали мое любопытство относительно того, как это работает (или не работает).