GAP/GRID-GAP и Flexbox

Если вы вдруг не знали, то знайте: Firefox применяет свойство grid-gap для flex-контейнеров.

Для меня это оказалось неожиданным именно из-за именования. Grid в названии вроде как указывает на применимость для grid-контейнеров. Вероятно, поэтому это свойство и переименовали в просто gap.

Свойство экспериментальное и сейчас поддерживается только в Firefox.

Firefox, button and flexbox

Как интересно! Если вы хотите красиво расположить внутри кнопки несколько элементов, используя чудную технологию flexbox, то вас может ждать неприятный сюрприз. Внутри элемента button в Firefox 46.0.1 (в других не проверял) flexbox не работает :(
Как это хотелось бы видеть и как это выглядит в Хроме и даже в ИЕ11:
flexbox внутри button в Хроме
И как это в Firefox:
flexbox внтури кнопки в Firefox

See the Pen eZqEGy by Sergey Kirichenko (@oknechirik) on CodePen.

P.S. Для себя эту проблему решил, обернув содержимое кнопки div’ом.
P.P.S. И баг есть такой.

Update: проблема решена в Firefox 52!!!