css - 将两个对象与 css 位置 :absolute; (without fixed margin-left or left properties) 对齐

Question

我有以下 css 行问题(再次大声笑)。现在问题出在'<li>' 中两个对象的对齐..(并排)想要在不使用 margin-left 的情况下进行。跟随文件 fiddle ，所以愿意帮助我:)

遇到的问题

我需要...没有固定的 margin-left 或 left 属性) [这里] http://jsfiddle.net/Igaojsfiddle/T6KrE/69/

.frdName{
margin-top:-10px;
top:50%;
/*margin-left:65px;*/
 font-weight: bold;
font-family:'Verdana', cursive;
font-size: 15px;
color: gray;
float:left;
position:absolute;

Answer 1

如果你不想使用margin-left，你可以使用position:

在您的 li 元素中，您必须遵循 CSS 规则:

.contactList > li { position: relative; }

.contactList > li > span:nth-child(2) {
   position: absolute;
   left: value; /*(e.g. 70px)*/
}

我放置 span:nth-child(2) 是因为在您的 HTML 代码中，您的第二个 span 元素始终包含文本。

这是 DEMO

干杯， 狮子座