css - 为什么标题工具提示不适用于 float 元素？

Question

我有一个 float 元素，其全部目的是显示一个“x”，表示您可以删除某些内容:

.remove_button{
background-color:#ff3300;
color:#ffffff;
font-family:Courier New,sans-serif;
font-weight:900;
font-size:20px;
float:right;
border-radius:5px;
padding:0px 6px 0px 6px;
margin-right:15px;
}

<div class="remove_button" title="Remove">x</div>

它确实在红色背景上显示了一个整洁的小“x”(不需要制作图片，我不擅长)，但问题是当鼠标悬停在按钮上时，标题属性显示在里面按钮，也作为工具提示:

------xRemove------   one '-' is one pixel of padding

Answer 1

试试这个，

.remove_button{
background-color:#ff3300;
color:#ffffff;
font-family:Courier New,sans-serif;
font-weight:900;
font-size:20px;
float:right;
border-radius:5px;
padding:0px 6px 0px 6px;
margin-right:15px;
position:relative;
}

.提示{ position:absolute； 显示:无； 边框:1px 实心#aab； 背景:#eef； 填充:0 3px； 左:15px； 顶部:25px；

.remove_button:hover .tip{
display:block;
}