如何防止边框包围的文本突破到下一行？

Question

我正在尝试编写一个小网页（对于一个类，而不是真实的），我遇到了一个奇怪的问题。盒子里有一些文字。我将代码放入文本边框，但它会导致换行并转到下一行。这是代码的样子：

Address: <p style="border-style: solid; width: 250px;">
487, street 1, 8th block, Brig, Indiana
<br>
Phone: 555555555
</p>

现在每当我运行它时，地址周围的框都在下一行，而不是在“地址：”旁边，我无法弄清楚原因。我怎么能阻止它，并把它放在同一条线上？

Answer 1

这是因为<p>是block element。因此它总是从一条新线开始。尝试将其设为inline-block元素，如下所示：

<p style="border-style: solid;
          width: 250px;
          display: inline-block;
          vertical-align: middle;">

Fiddle

Answer 2

尝试

#div { 
    white-space: nowrap;
}