Home > DeveloperSection > Forums > How to fix bootstrap tab Vertical with text?
Kamlakar Singh
Kamlakar Singh

Total Post:194

Points:1396
Posted on    February-10-2015 5:43 AM

 CSS-CSS3 Bootstrap  Bootstrap Tab 
Ratings:


 1 Reply(s)
 919  View(s)
Rate this:

Hello I’m using bootstrap vertical tabs

Here is my code:

<div class="row">

    <div class="col-md-3">

        <ul class="nav nav-tabs tabs-left">

            <li class="active"><a href="#home-v" data-toggle="tab">Home</a></li>

            <li><a href="#profile-v" data-toggle="tab">Profile</a></li>

        </ul>

    </div>

    <div class="col-md-9">

        <div class="tab-content">

            <div class="tab-pane active" id="home-v">Home Tab.</div>

            <div class="tab-pane" id="profile-v">Profile Tab.</div>

        </div>

    </div>

</div>

Screenshot:

My question is that, I’m want to set the orientation vertically of this tab with text. How is it possible?

Thank you in advance.



Pawan Shukla

Total Post:34

Points:246
Posted on    February-10-2015 6:32 AM

Hi kamlakar!

I am trying to solve your problem

This is possible and very simple you can use only a class sideways

Here is my code:

<div class="row">

    <div class="col-md-3">

        <ul class="nav nav-tabs tabs-left sideways">

            <li class="active"><a href="#home-v" data-toggle="tab">Home</a></li>

            <li><a href="#profile-v" data-toggle="tab">Profile</a></li>

        </ul>

    </div>

    <div class="col-md-9">

        <div class="tab-content">

            <div class="tab-pane active" id="home-v">Home Tab.</div>

            <div class="tab-pane" id="profile-v">Profile Tab.</div>

        </div>

    </div>

</div>

Screenshot:

I hope this is help to you.


Don't want to miss updates? Please click the below button!

Follow MindStick