帶有關閉按鈕的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'); 
});