Вкладки jQuery включают горизонтальную прокрутку

Как включить горизонтальную прокрутку на вкладках jQuery определенной ширины в одной строке.

По умолчанию плагин jQuery UI перемещает последнюю вкладку на следующую строку.

Итак, я использовал обходной путь, чтобы немного увеличить ширину, установив стиль css, как показано ниже:

#tabs_div .scroller {
  overflow: auto;
}
#tabs_div ul { 
  width: 1100px; 
}

И вкладки установлены, как показано ниже,

<div id='tabs_outer_div' class="tabs">
  <div id='tabs_div' class="scroller" style='display:none;width:100%'>
   <ul>....
 </div>
</div>

Отредактировано для включения jsfiddle, здесь вкладки отображаются в несколько строк. Как установить их в одну строку (строку). - http://jsfiddle.net/karthikn_jay/pdnr0op9/


person Karthik    schedule 11.06.2015    source источник
comment
Можете ли вы поделиться Live fiddle ..! это помогает нам увидеть вашу работу и легко снять проблему   -  person Deepak Yadav    schedule 11.06.2015


Ответы (1)


Просто добавьте пользовательский стиль в свою таблицу стилей в .ui-tabs .ui-tabs-nav и .ui-tabs .ui-tabs-nav li, если нужно добавить уникальный родительский уровень selector

http://jsfiddle.net/pdnr0op9/3/ like this

person Karthi Keyan    schedule 11.06.2015