Search code examples
cssline-breaksword-wrap

Advanced wraps in CSS

I have the following code:

<time>2018-23-12&nbsp;23:59</time> — <time>2018-24-12&nbsp;23:59</time>

The problem is that dash. When the second time tag is breaking into a new line, the dash should break into an extra line. When no break is needed, then the text should be as it is.

So the output behaviour, what I am trying to force is:

<time>2018-23-12&nbsp;23:59</time>
—
<time>2018-24-12&nbsp;23:59</time>

Any ideas how to solve that? Thanks for your help everybody :-)

Solution 

  • time,
span {
  display: inline-block;
}
    <time>2018-23-12&nbsp;23:59</time> <span>—</span> <time>2018-24-12&nbsp;23:59</time>

    Something like this ?