带有关闭按钮的HTML选项卡

Question

我想在标题文本和关闭按钮的右上角或左上角都有一个选项卡。我怎样才能做到这一点？

图片澄清

============================= 
| X       | 
|       | 
|   Text Here!  | 
============================= 

这里是我到目前为止已经试过......

<li class="tabLi ui-state-default ui-corner-top "> 
      <div> 
       <input type="button" name="close_tab" class="close_tab_button"/> 
       <a href="<c:url value="/ex.url"></c:url>" 
       title="Test"> "Text Here!"</a> 
      </div> 
</li> 

用下面的CSS

.close_tab_button { 
    background-image:url("/messaging-center/resources/images/close_button.gif"); 
} 

目前发生的情况：在按下按钮在文本和标签变大时，会发生这种情况，因为输入和链接不重叠。

Answer 1

你应该给你的按钮position:absolute

.close_tab_button { 
    background-image:url("/messaging-center/resources/images/close_button.gif"); 
    position:absolute; 
    top: 5px; 
    left:5px; 
} 

是绝对定位的元素被取出流程，因此在放置其他物品时不占用空间r元素。 （第here）

现在你的按钮将不会把你的文字往下

Answer 2

看一看，与it

玩这是代码，您需要：

$('.text').before().click(function(){ 
$('.text').fadeOut('fast'); 
});