How can I get rid of the open space between the top of my site and my navbar (bootstrap)

When I tried to do static navigation, I came across something strange. I have a space between the navbar and the top side of my website.

enter image description here

Any ideas on how to fix this so that my nav is in the open space location? (I'm not good at things that I know ...)

    <body>
    <div id="wrapper">
        <div class= "navbar navbar-inverse navbar-static-top">
            <div class="container">
                <a href="#" class="navbar-brand">BlahBlahism</a>

                <button class="navbar-toggle" data-toggle = "collapse" data-target= ".navHeaderCollapse">
                    <span class = "icon-bar"></span>
                    <span class = "icon-bar"></span>
                    <span class = "icon-bar"></span>
                </button>   
                <div class="collapse navbar-collapse navHeaderCollapse">
                    <ul class="nav navbar-nav navbar-right">
                        <li><a href="index.html">Home</a></li>
                        <li><a href="contact.html">Contact</a></li>
                    </ul>
                </div>
            </div>
        </div>

      

Not involved in CSS

+3


source to share


2 answers


This code works great when I tried to work. but still you should try this. some versions of internet explorer do not support nav or nav-bar class, please check

hope this helps



body, html {
  margin: 0px;
  padding: 0px;
}

      

+2


source


I don't know what your code is saying, but I'm guessing it has something to do with the default behavior of these elements.

Possible solution: Do some CSS and remove padding and / or margin.

<style>
#theNavbarID{
    padding: 0px;
    margin: 0px;
}
</style>

      



Put in some code and I'll expand if needed.

EDIT: The code works very well, you can try it here: JSFiddle

+1


source







All Articles