jquery - 在一行中对齐两个跨度类

Question

所以..我创建了一些表单，我的用户可以填写这些表单并将一些文档文件上传到其中。我遇到的问题是，当我的用户上传他们的文件时，会出现附件名称以及用于删除上传的 X 按钮。现在一切都出现了，但 X 和文档名称没有正确排列，而是在两行中，我想知道是否有人可以帮助我解决这个问题。

.ui-icon, .ui-widget-content .ui-icon {
background-image: url(images/ui-icons_222222_256x240.png);
}
.ui-icon {
width: 16px;
height: 16px;
}
.ui-icon {
display: block;
text-indent: -99999px;
overflow: hidden;
background-repeat: no-repeat;
}
.blueArea {
color: #2795b6;
padding: 5px;
}
.blueArea {
line-height: 29px;
padding: 0 5px 10px !important;
vertical-align: bottom;
}
.greyArea {
color: #C0C0C0;
}
.greyArea {
line-height: 25px;
vertical-align: bottom;
}

<div>
	<input type="checkbox" name="j_id0:formId:j_id162:0:j_id166" checked="checked" class="015g0000000CTPOAA4" style="display:none;">
	<span class="ui-icon ui-icon-closethick" onclick="unselect('015g0000000CTPOAA4')"></span>
	<span class="blueArea">"seal.png"</span>
	<span class="greyArea">"29 KB"</span>
<div>

Answer 1

我最好的猜测是一个元素(可能是 X)是 display:block。将其设置为显示:内联 block ；在您的 CSS 中，它应该可以正常工作。