CSS:如何使跨度与其内容一样宽

Question

我正在使用以下代码片段将一个跨度 append 到另一个到目前为止工作正常的跨度。 父跨度的内容只有一个名称，并且没有为任何跨度定义宽度。

我的问题是，我 append 的跨度总是放在新行中，而不是直接放在父跨度后面。 我必须做什么才能使它与父跨度出现在同一行中，即直接在它后面？

我的功能(工作):

function myFunction()
{
    var parentID = someID;
    var statusID = 'status' + parentID;

    $('<span/>', {
    id: statusID
    }).addClass('active').appendTo('#'+parentID);
}

示例父跨度:

<span class="user" id="someID"><strong>Last Name, First Name</strong></span>

非常感谢您对此的任何帮助，Tim

Answer 1

默认情况下，每个元素的宽度与其内容占用的空间一样多，因此您无需为此编写任何代码，只需删除替换元素默认 width 的任何代码。

你想达到什么目的？

我遇到的唯一问题是，您的父元素比它应该占用的空间更宽。我的意思是 parent 获得了更多空间，所以 child 在实际位置下方一行。比如给父元素一个有限的空间作为

.parent {
  max-width: someval;
}

.child {
  width: auto;
}

还有一件事，你是如何执行你的功能的？