mrkent
mrkent

Reputation: 353

How to make tabs fixed size in twitter bootstrap

What's the best way to fix the width and height of left tabs in twitter bootstrap to use it as a fixed size navigation bar? Questions are better illustrated in the code below.

      <div class="tabbable tabs-left">
        <ul class="nav nav-tabs">
          <li class="nav-header">Questions</li>
          <li class=""><a data-toggle="tab" href="#lA">------ Question 1 -------</a></li>
          <li class="active"><a data-toggle="tab" href="#lB">------ Question 2 ------</a></li>
        </ul>
        <div class="tab-content">
          <div id="lA" class="tab-pane">
            <p>How do I fix the width of this section as to avoid using the --------</p>
          </div>
          <div id="lB" class="tab-pane active">
            <p>Can I fix the height as well?</p>
          </div>
        </div>
      </div>

Upvotes: 2

Views: 9233

Answers (1)

Turnip
Turnip

Reputation: 36642

I'm not really familiar with Bootstrap but as no body else has answered, here goes...

Since the two elements you have highlighted both have IDs, why cant you just give them specific widths / heights?

#1A {
    width: 300px;
}

#1B {
    height: 30px;
}

As I say, I'm not familiar with Bootstrap so I may be misunderstanding your question but that seems like the simple solution to me.

Upvotes: 2

Related Questions