Javascript 为什么我的右浮动元素越来越多地进入左浮动

我正在学习一个待办事项列表教程。它工作正常，直到我试着把它整理一下。我有一个字体可怕的垃圾桶图标内的一个按钮与类“删除”。基本上我去掉了按钮上的所有样式，所以它只是一个垃圾图标。用户单击它，就可以按原样删除列表项。我想将弹出的任务中的垃圾桶右对齐。它可以做到这一点，但每次我添加一个新任务，垃圾桶就会越来越少地浮在右边

我会尽量发布相关代码，但我不知道为什么会发生这种情况。我正在使用引导来帮助创建样式，而且加号圆形按钮似乎不会在创建任务时干扰任务。任何想法都会很棒，谢谢大家

函数get_todos（）{ var todos=新数组； var todos_str=localStorage.getItem（'todo'）； 如果（todos_str！==null）{ todos=JSON.parse（todos_str）； } 返回待办事项； } 函数add（）{ var task=document.getElementById（'task'）。值； var todos=get_todos（）； 推送（任务）； setItem（'todo'，JSON.stringify（todos））； show（）； 返回false； } //这主要是删除按钮发生的地方 函数删除（）{ var id=this.getAttribute（'id'）； var todos=get_todos（）； todos.拼接（id，1）； setItem（'todo'，JSON.stringify（todos））； show（）； 返回false； } 函数show（）{ var todos=get_todos（）； var html='

'； 对于（变量i=0；i'； }; html+='

'； document.getElementById（'todos'）。innerHTML=html； var buttons=document.getElementsByClassName（'remove'）； 对于（变量i=0；i

。删除{/*垃圾桶按钮*/
颜色：#C0C0；
字体大小：24px；
边界：0；
填充：0；
背景色：透明；
浮动：对；
}

试验
+

这是因为它上面的浮动元素挡住了路。避免这种情况的一种方法是将

clear:right

或

clear:both

添加到浮动元素的样式中

.remove { /*Trash can button*/
    color:#C0C0C0; 
    font-size:24px;
    border:0;
    padding:0;
    background-color:transparent;
    float:right;
    clear:right;
}

---

我研究了CSS，发现下面的CSS样式很有效。更正，请参见下面的更改。这会让名单看起来更漂亮

在

元件上

加

打开。删除类

除去

font-size: 24px;
float:right;

加

font-size: 24px;
float:right;

position: absolute;
right: 20px;