to top

Mon - Fri 8:30 am to 5:00 pm

Talk to us (800) 909 902

Elements

Nothing can be done without hope

Tabs

To create a set of tabs, use the uk-tab class. Uikit tabs fit nicely in responsive layouts by converting the tabs into a dropdown menu. The tabs also scale to fit its contents by adjusting the tab height automatically.


Horizontal tabs


  • This is the first tab

    Do not dwell in the past, do not dream of the future, concentrate the mind on the present moment. Never be bullied into silence. Never allow yourself to be made a victim. Accept no one's definition of your life; define yourself.

  • This is the second tab

    Do not dwell in the past, do not dream of the future, concentrate the mind on the present moment. Never be bullied into silence. Never allow yourself to be made a victim. Accept no one's definition of your life; define yourself.

  • This is the third tab

    Do not dwell in the past, do not dream of the future, concentrate the mind on the present moment. Never be bullied into silence. Never allow yourself to be made a victim. Accept no one's definition of your life; define yourself.


markup
<ul class="uk-tab uk-tab-grid uk-tab-top" data-uk-tab="{connect:'#tabs_example1', animation: 'fade'}">
    <li class="uk-active"><a href="#">Tab 1</a></li>
    <li><a href="#">Tab 2</a></li>
    <li><a href="#">Tab 3</a></li>
  </ul>

  <ul id="tabs_example1" class="uk-switcher uk-margin uk-tab-content">
    <li>Your content goes here</li>
    <li>Your content goes here</li>
    <li>Your content goes here</li>
  </ul>

Vertical tabs

Vertical tabs use a combination of uk-grid, uk-width-* and uk-tab classes. The uk-grid class is used to define the tab container; the uk-width-* class is used to define the widths of the tabs and content; the uk-tab class creates the tab elements.


  • This is the first tab

    Do not dwell in the past, do not dream of the future, concentrate the mind on the present moment. Never be bullied into silence. Never allow yourself to be made a victim. Accept no one's definition of your life; define yourself.

  • This is the second tab

    Do not dwell in the past, do not dream of the future, concentrate the mind on the present moment. Never be bullied into silence. Never allow yourself to be made a victim. Accept no one's definition of your life; define yourself.

  • This is the third tab

    Do not dwell in the past, do not dream of the future, concentrate the mind on the present moment. Never be bullied into silence. Never allow yourself to be made a victim. Accept no one's definition of your life; define yourself.


markup
<div class="uk-grid">
    <div class="uk-width-medium-2-10">
      <ul class="uk-tab uk-tab-left" data-uk-tab="{connect:'#tabs_example2', animation: 'fade'}">
        <li class="uk-active"><a href="#">Tab 1</a></li>
        <li><a href="#">Tab 2</a></li>
        <li><a href="#">Tab 3</a></li>
      </ul>
    </div>

    <div class="uk-width-medium-8-10">
      <ul id="tabs_example2" class="uk-switcher uk-margin uk-tab-content">
        <li>your content goes here</li>
        <li>your content goes here</li>
        <li>your content goes here</li>
      </ul>
    </div>
  </div>

Stay in touch with the latest news

We'd like to send you our latest news.

Truford Pro

Truford Pro
Mirage Plaza, Waiyaki Way
Nairobi, Kenya
+254 (800) 909 902
+254 (800) 909 901
info@truford.pro

Partners

We are passionate about what we do. Here are our accolades.

Partners