Mysterious Whitespace in Between Bootstrap2 Navbar and Row Underneath

Mysterious whitespace in between Bootstrap2 Navbar and row underneath

You may want to override the margin-bottom: 20px from navbar :

.navbar {
margin-bottom: 0;
}

Something like that : http://jsfiddle.net/q4M2G/
(the !important is here just to override the style of the CDN version of bootstrap I'm using in the jsfiddle but you should not need to use it if your style correctly overrides bootstrap styles)

How to remove a gap between navbar and container-fluid?

The navbar class has a default margin-bottom:20px in the bootstrap css. You can override it by adding this:

.navbar {
margin-bottom: 0px;
}

N.B.: Make sure the above css property is below the bootstrap default css.

How do i remove this unwanted gap between my navabar and featured image?

What I understood from you that you mean the white vertical space between the parallax div and the navbar and my answer will depend on that, if your problem is different please let me know.

Your solution is all about removing:

1) The margin property from the "h2":

.parallax h2 {
margin-top: 0;
}

2) The padding property from the "navbar":

.navbar {
padding-bottom: 0;
}

Hope it works with you!

Twitter Bootstrap - add top space between rows

Editing or overriding the row in Twitter bootstrap is a bad idea, because this is a core part of the page scaffolding and you will need rows without a top margin.

To solve this, instead create a new class "top-buffer" that adds the standard margin that you need.

.top-buffer { margin-top:20px; }

And then use it on the row divs where you need a top margin.

<div class="row top-buffer"> ...

Bootstrap carousel multiple frames at once

Can this be done with bootstrap 3's carousel? I'm hoping I won't have
to go hunting for yet another jQuery plugin

As of 2013-12-08 the answer is no. The effect you are looking for is not possible using Bootstrap 3's generic carousel plugin. However, here's a simple jQuery plugin that seems to do exactly what you want http://sorgalla.com/jcarousel/

What is the best way to add some space after Bootstrap navbar?

Updated 2018

Bootstrap 3

According to the Bootstrap docs (http://getbootstrap.com/components/#navbar-fixed-top) you should use padding-top on the body..

"The fixed navbar will overlay your other content, unless you add
padding to the top of the . Try out your own values or use our
snippet below. Tip: By default, the navbar is 50px high."

body { padding-top: 70px; }

Demo: http://www.bootply.com/Ob3Bajkv1f


Bootstrap 4

Padding is also recommended for the fixed-top Navbar in Bootstrap 4 to prevent content hiding at the top of the body. You can add custom CSS for padding-top or use the pt-5 utility class on the body tag:

<body class="pt-5"></body>

Bootstrap navigation pills have extra white space between them

Remove margin

CSS

.nav-pills>li+li{
margin:0px;
}

Problem with Navbar Bootstrap on mobile view

Thanks guys !
The problem came from my CSS I put the property (position: absolute left 74%) to my ul hence the problem on mobile view.



Related Topics



Leave a reply



Submit