排列图标和布局

Question

我有这些图标漂浮到右边，但他们没有正确对齐，我想修复它们，所以如果中间的一个图标丢失 - 左侧的图标会正常移动到中间部分。我希望它们具有灵活性，具体取决于添加和删除以及移动图标。

这里是一个的jsfiddle：http://jsfiddle.net/67pun/

<span class="toggleIcon accordion_collapse_icon float_right icon-minus"> + </span> 

<span class="float_right week_date_range">Dec 2 - 6</span> 

<a id="editElement" class="btn_inline_block float_left btn_edit_element"> @ 
        </a> 

CSS：

.accordion_collapse_icon { 
position: relative; 
top: 15px; 
right: 20px; 
cursor: pointer; 
} 

week_date_range { 
position: relative; 
top: 13px; 
right: 40px; 
color: #a5a5a5; 
} 
.btn_inline_block { 
display: inline-block; 
padding-left: 0; 
padding-right: 0; 
-webkit-box-sizing: border-box; 
-moz-box-sizing: border-box; 
box-sizing: border-box; 
} 
.float_right, .float-right { 
float: right; 
} 
[class*=" icon-"] { 
display: inline; 
width: auto; 
height: auto; 
line-height: normal; 
vertical-align: baseline; 
background-image: none; 
background-position: 0% 0%; 
background-repeat: repeat; 
margin-top: 0; 
} 

Answer 1

我不太确定你想要的最终输出。这里有一个刺在它：http://jsfiddle.net/HW8E6/

我加了一个包装容器和浮动是正确的：

.container { 
    float: right; 
} 

我会说，通常浮动权的时候，我喜欢飘起了周围的容器，然后包括我的项目。这样做的原因在于，要将所有东西逐一浮动，您必须以相反的顺序添加它们。如果你漂浮一个容器，那么你可以保持它们的逻辑顺序。