使用Css阻止使用以前的文本包装文本?

时间:2017-12-06 18:36:31

标签: css

是否有一种CSS方法可以防止文本元素从前一个文本元素换行?

即。 My Table Header <i class="fa fa-search"></i>显示为

  

     

     

标题

     

MySearchIcon

但我希望它显示如下:

  

     

     

Header MySearchIcon

实际代码是Razor和Html的组合

  <th>
   @Html.DisplayNameFor(m => m.Projects.FirstOrDefault().Name) <i class="fa fa-search smaller fa-fade"></i>
  </th>

这是在一个表的标题中,根据标题长度,我想要包装,但我想要一个空格,图标将粘贴到标题中的最后一个单词而不是换行。

由于代码的Razor片段,我不能直接将非破坏空间放在输出上,

3 个答案:

答案 0 :(得分:0)

我相信你可以使用白色空间:nowrap;在你的CSS中。

您还可以查看此问题: HTML+CSS: How to force div contents to stay in one line?

答案 1 :(得分:0)

不确定。您可以将HTML实体用于不间断空间。它会使您的文本节点和图标如下

My Table Header&nbsp;<i class="fa fa-search"></i>

答案 2 :(得分:0)

解决方案最终是在剃刀代码之后添加元素。 即。

 <th>
   @Html.DisplayNameFor(m => m.Projects.FirstOrDefault().Name)<text>&nbsp;<i class="fa fa-search smaller fa-fade"></i></text>
  </th>