文本与<a></a>之间不间断的空格

Question

如何在<a>

中嵌套的文本元素和span标记之间提供不间断的空白区域

<span>
    <label> this is xyz</label>
    <a href =""> 
</span>

我想使用CSS而非&nbsp;

此外，我尝试使用white-space的所有组合，但它没有任何好处。

Answer 1

你可以设置标签的边距，并设置white-space:nowrap以防止破坏，如果空白空间属性不起作用，那么可能有其他样式可能会干扰它，甚至其他html元素，如您在问题中的当前代码不完整，我们无法看到完整标记的样子并告诉您。

例如，如果某个样式将您的锚标记设置为块元素（display:block;），则即使使用white-space属性，也会导致它突破到新行。尝试将display:inline添加到样式中以查看它是否有帮助

HTML

<span>
    <label> this is xyz</label>
    <a href ="">some text</a>
</span>

CSS

span {
   white-space:nowrap;
}
span a {
  margin-left:10px;
  margin-right:10px;
  display:inline;
}

的 JSFiddle Demo

Answer 2

请使用以下CSS和HTML： -

HTML： -

<span>xyz<a href="http:ggogle.com">LINK</a></span>

CSS： -

a:before
{
 content:" ";
}
a{text-decoration:none;}

看小提琴： - http://jsfiddle.net/npsingh/TJhh7/2/show

Answer 3

如果您想使用CSS，请参阅white-space属性：

<span style="white-space:nowrap">
    <label>this is xyz</label>
    <a href="http://www.stackoverflow.com">Stack Overflow</a>
</span>