Border around multiline text in a div (html/css)

Question

I want to have a border around multiline text, I have:

Morbi hendrerit pretium nibh quis <span style='border: 1px solid black;'>
mattis. Blah blah blah</span> blah blah...

Now, when the span spans more than one line, the border is created around each line of text, which I don't want to happen - I am aiming for a border around a whole block, with the text being inline (display:block/inline-block don't do the job properly).

Is there a way of achieving that without playing with javascript?

Answer 1

Wrap the whole string in a div and set it to display: inline-block.

<div style="border: 1px solid black; display: inline-block">
  Morbi hendrerit pretium nibh quis<br>
  mattis. Blah blah blah blah blah...
</div>