My best guess is that there is a difference between Firefox and Chrome in how they handle linebreaking for inline elements that have white-space: nowrap property.
Apparantly Chrome allows line breaks between inline elements within a container if the container's width is insufficient to accommodate them on a single line, while Firefox renders it differently and no linebreak occurs with that same property value. If the nowrap value is removed, behaviour would be consistent across those two browsers and wrapping happens.
However, I think this property serves a purpose, it was introduced in this fix for this issue. If the property is removed, regions and keywords would be wrapped on white space, potentially splitting phrases that are only meaningful together onto two lines, which is probably undesirable.
Therefore, my proposed fix makes those elements inline-block, which allows them to wrap as separate boxes and respect the container’s width.
This PR addresses issue #1854.
My best guess is that there is a difference between Firefox and Chrome in how they handle linebreaking for inline elements that have white-space: nowrap property.
Apparantly Chrome allows line breaks between inline elements within a container if the container's width is insufficient to accommodate them on a single line, while Firefox renders it differently and no linebreak occurs with that same property value. If the nowrap value is removed, behaviour would be consistent across those two browsers and wrapping happens.
However, I think this property serves a purpose, it was introduced in this fix for this issue. If the property is removed, regions and keywords would be wrapped on white space, potentially splitting phrases that are only meaningful together onto two lines, which is probably undesirable.
Therefore, my proposed fix makes those elements inline-block, which allows them to wrap as separate boxes and respect the container’s width.