ui选项卡关闭文本下方的按钮

ui选项卡关闭文本下方的按钮

本文介绍了jquery ui选项卡关闭文本下方的按钮的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用jquery ui制表符



并使用它们动态关闭它们的功能。



示例页面,其中点击链接添加标签导致

在标签面板中添加标签...



现在在 firefox



的文本下方,这会导致标签面板或标签正文中出现乱码。



像其他浏览器一样显示在同一行



css im使用是

  .ui-tabs {padding:.20em; zoom:1; } 
.ui-tabs .ui-tabs-nav {list-style:none;位置:相对; padding:.2em .2em 0; height:27px; }
.ui-tabs .ui-tabs-nav li {position:relative; float:left; border-bottom-width:0!important; margin:0 .2em -1px 0; padding:0; font-size:63.5%; }
.ui-tabs .ui-tabs-nav li a {float:left; text-decoration:none; padding:.5em 1em; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected {padding-bottom:1px; border-bottom-width:0; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a,.ui-tabs .ui-tabs-nav li.ui-state-disabled a,.ui-tabs .ui- tabs-nav li.ui-state-processing a {cursor:text; }
.ui-tabs .ui-tabs-nav li a,.ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a {cursor:pointer; font:62.5%; }
.ui-tabs .ui-tabs-panel {padding:1em 1.4em;显示:block; border-width:0;背景:黑色;颜色:白色; font-size:12px; }
.ui-tabs .ui-tabs-hide {display:none!important; font:62.5%; }

#tabs .ui-tabs-nav li a:hover {float:left; text-decoration:none; padding:.5em 1em; background-color:#868472; }
#tabs-profile .ui-tabs-nav li {position:relative; float:left; border-bottom-width:0!important; margin:0 .2em -1px 0; padding:0; font-size:75%; }

请帮助



/>
Pradyut

印度

解决方案
  .ui-icon-close {float:left;} 


I m using jquery ui tabs

and i m using them with the function of dynamically closing them.

the example page here where clicking on the link 'add tab' leads to

adding of tabs in the tabs panel...

now in firefox the close buttons are displayed beneath the text of the tab

which is leading to garbled text in the tab panel or the body of the tabs

like other browsers how can i display it in same line

the css i m using is

     .ui-tabs { padding: .20em; zoom: 1; }
    .ui-tabs .ui-tabs-nav { list-style: none; position: relative; padding: .2em .2em 0; height:27px;  }
.ui-tabs .ui-tabs-nav li { position: relative; float: left; border-bottom-width: 0 !important; margin: 0 .2em -1px 0; padding: 0; font-size:63.5%;  }
.ui-tabs .ui-tabs-nav li a { float: left; text-decoration: none; padding: .5em 1em;  }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected { padding-bottom: 1px; border-bottom-width: 0;  }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text;  }
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; font: 62.5%; }
.ui-tabs .ui-tabs-panel { padding: 1em 1.4em; display: block; border-width: 0; background:black; color:white; font-size: 12px; }
.ui-tabs .ui-tabs-hide { display: none !important; font: 62.5%; }

#tabs .ui-tabs-nav li a:hover { float: left; text-decoration: none; padding: .5em 1em; background-color: #868472; }
#tabs-profile .ui-tabs-nav li { position: relative; float: left; border-bottom-width: 0 !important; margin: 0 .2em -1px 0; padding: 0; font-size:75%; }

Please help

thanks
Pradyut
India

解决方案
.ui-icon-close { float: left;}

这篇关于jquery ui选项卡关闭文本下方的按钮的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-22 22:59