Is there a way to apply horizontal margin while inheriting vertical margin without explicitly setting margin-left and margin-right? I was hoping for something like margin: inherit 20px; to be effective.
Take a look at the example here: https://jsfiddle.net/cm8kwfok/1/
Html:
<div class="outer">
<div class="inner horizontal-margin-working">
Working but not ideal
</div>
<div class="inner horizontal-margin-notworking">
Not working as expected
</div>
</div>
Css: .outer { background: #27ae60; padding: 10px; }
.inner {
margin: 10px;
}
.horizontal-margin-working {
margin-left: 50px;
margin-right: 50px;
}
.horizontal-margin-notworking {
margin: inherit 50px;
}