Reputation:
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:
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
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