user2129623
user2129623

Reputation:

reducing the header/footer size in bootstrap navbar css

I am newbie to bootstrap css. Facing probelm in adjusting height of header and footer.

code for footer:

<div id="footer">
      <div class="container">
    <div class="collapse navbar-collapse">
            <ul class="nav navbar-nav">
              <li class="active"><a href="#">What is thenWat?</a></li>
              <li><a href="#about">How does it work?</a></li>
              <li><a href="#contact">Feedback</a></li>
              <li><a href="#contact">Contact us</a></li>                            
            </ul>
          </div><!--/.nav-collapse -->
      </div>
    </div>

here is codepen with added css:

Link to codepen

similarly link to header: link to header demo

Can someone tell me how to reduce the height or footer?

I tried with reducing height in header footer class but no change.

What is the logic behind editing bootstrap elements?

Upvotes: 0

Views: 5531

Answers (1)

amatellanes
amatellanes

Reputation: 3735

You can change the height of the header in the Customize section on Bootstrap official site:

http://getbootstrap.com/customize/#variables-navbar

Looking for the variable @navbar-height.

Example: http://codepen.io/anon/pen/sHLmJ

Upvotes: 1

Related Questions