Prevent inline-block from wrapping on white-space: pre?
css, word-wrap
Solution
This bug is 4 years old and still present in the latest Chrome and Safari, but I did find a workaround that doesn't add undesirable whitespace, which is to add an empty `:after` pseudo-element: http://jsbin.com/oQuBAmIJ/1/edit
Problem
It seems Chrome is wrapping an inline-block element if it is at the end of a line even if there is a white-space:pre container around it with overflow: auto. Is there a workable solution to prevent this from happening without changing the content? ``` <div style="width:400px;height:200px;overflow:auto;white-space:pre"> The span should be at the end of this text, however, it wraps to the next line.<span style="width:1px;display:inline-block;height:1em;background:red"></span> </div> ``` The white-space must be preserved using newlines at least. Spaces and tabs may be compressed.