Особенность расчёта размеров в ФФ

by SerGen

HTML

<span class="Bubble">
    <span class="Bubble__trigger">Рассчитайсь!</span>
    <span class="Bubble__content">
        <a class="BubbleSelect__item" href="#">Первый!</a>
        <a class="BubbleSelect__item" href="#">Второй!</a>
    </span>
</span>

CSS

body {
	margin-top: 20vh;
	text-align: center;
}


.Bubble {
	position: relative;
}

.Bubble__trigger {
	background-color: #caa;
	position: relative;
}

.Bubble__content {
	background: #aca;
	left: 0;
	position: absolute;
	top: 100%;
	min-width: 100%;
}

.BubbleSelect__item {
    display: block;
}

JavaScript

/*!
 * В ФФ нижний блок будет шире, чем верхний
 * Исправит:
 * - удаление пробелов между элементами;
 * - `display: inline-block;` для `.Bubble`
 *
 * Проверялось в версиях 5 и 26
 */