В чем разница margin-top и -webkit-margin-before

Webkit добавил свои собственные значения, которые:

-webkit-margin-before:
-webkit-margin-after:
-webkit-margin-start:
-webkit-margin-end:

Я понимаю разницу (margin-left и -webkit-margin-start) или (margin-right и -webkit-margin-end), которая связана с языками "слева направо" или "справа налево".

Мой вопрос в том, в чем разница между (margin-top и -webkit-margin-before) или (margin-bottom и -webkit-margin-after)?

Примечание. Очевидно, что префикс -webkit работает только в браузерах браузеров webkit, таких как хром и сафари. Этот вопрос не связан с этим.

Ответ 1

Лучший ответ, который я смог найти до сих пор, - -web-margin-before действует так же, как margin-top на обычных документах, но будет действовать как margin-bottom на языках "снизу вверх" (эта же идея относится к -webkit-margin-after).

В этой ссылке вы можете найти несколько "доверху" языков omniglot.com/writing/direction.htm (спасибо @MarkPlewis)

Ответ 2

Пока Chrome и WebKit поддерживают все свойства и ключевые слова из -webkit-, Safari поддерживает только начало (Mozilla делает немного лучше, так как поддерживает и начало, и конец). Все эти свойства, как говорят, работают в Safari 6; поэтому, когда эти корабли, нам нужно будет заменить верхние, правые и нижние значения на префиксные свойства, чтобы сделать наше направление "направления" агностиком.

В основном -webkit- может использоваться для таргетинга на различные браузеры, такие как Safari, Chrome и Firefox. Подробную статью можно найти здесь.

В этой статье обсуждается создание базовой таблицы стилей для браузеров на основе WebKit.

Чтобы не использовать значения -webkit-значения, я использую:

*, *:before, *:after {
    box-sizing: inherit;
}