Css 如何拥有<；span>；在a<；李>；对齐到<；李>；

我有一个“标签”类的跨度。我将此标签嵌套在

中，我希望它与
中其余内容的右侧对齐

在我尝试修改css之前，我的li看起来是这样的（橙色的“new item”是标签）：

如果我尝试
float:right
标签将向右移动，但位于
的右上角，如下所示：

您还可以看到，在一种情况下，新项目标签被推到下一行-我认为这是一个无关的问题

关于如何让我的“新项目”跨度移动到我的
右侧的任何提示？这里有一个链接，指向我为演示而主持的页面：

项目1的说明
新项目


项目2的说明
新项目




项目1的说明
新项目


项目2的说明
新项目




项目1的说明
新项目


项目2的说明
新项目

给班级贴上
标签
页边距似乎有助于：

span.label {
  float: right;
  margin: 10px;
}

试试相对位置

span.label{
float: right;
position:relative;
top:5px;
}

例如
这只解决了css的所有问题

.label-warning, .badge-warning {
    background-color: #f89406;
    float: right;
    margin-top: 9px;
}
.product_summary {
    clear: both;
}
.product_summary img {
    float: left;
}
.name, .price {
    float: left;
    line-height: 37px;
}

您可以使用边距将按钮从顶部放置在中间。另外，您可以使用相同的位置，如
位置：绝对；右：0；顶部：45%
。当图像的大小（高度）增加时，此代码甚至工作得更好。
使用
class=“pull right”
这仍然会将标签向上撞到“顶部右侧”，而不是像上面第二张图所示将其向右滑动。那爆炸得很快。我不知道当你这么快地提供这么多不同的编辑时该怎么办。这些选项中没有一个能完全满足我的需要——它们似乎也都“炸毁”了我的标签。我很感激我的努力，因为我确实来这里寻求答案——但下次少尝试“枪杆子”方法？当然，实际上我自己也在尝试这些方法，只是在等待最好的方法——我使用了
margin top:10px
使用bootstrap类
pull right
您可能希望更正“spant.label”中的键入错误以供将来参考--我无法对您的帖子进行如此小的编辑。很优雅，但无法解决他的双标签问题。
span.label {
  float: right;
  margin: 10px;
}

span.label{
float: right;
position:relative;
top:5px;
}

.label-warning, .badge-warning {
    background-color: #f89406;
    float: right;
    margin-top: 9px;
}
.product_summary {
    clear: both;
}
.product_summary img {
    float: left;
}
.name, .price {
    float: left;
    line-height: 37px;
}