Spazio al di sotto della barra di comando superiore fissa Bootstrap

C'è uno spazio misterioso (circa 25px) tra la barra di navigazione e il contenuto div. Sto usando la risoluzione dello schermo Chrome e 1600x900. Ho esaminato altre domande con lo stesso identico problema e ho applicato le risposte fornite, ma il problema persiste. Ho impostato il margine inferiore della barra di navigazione su 0 e sovrascrivo Bootstrap 3.1.1. HTMLSpazio al di sotto della barra di comando superiore fissa Bootstrap

<!DOCTYPE html> 
    <html> 
     <head> 
      <meta charset="utf-8"> 
      <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
      <title>Title</title> 
      <meta name="description" content=""> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 

      <link rel="stylesheet" href="css/bootstrap.min.css"> 
      <link rel="stylesheet" href="css/hover.css"> 
      <link rel="stylesheet" href="css/style.css"> 
      <script src="js/lib/modernizr-2.6.2-respond-1.1.0.min.js"></script> 
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
     </head> 

     <body> 
       <nav class="navbar navbar-default navbar-fixed-top" role="navigation"> 
        <div class="container-fluid"> 
         <div class="navbar-header"> 
          <a href="#"><img src="img/title.png"></img></a> 
         </div> 
         <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 
          <ul class="nav navbar-nav navbar-right"> 
           <li><a href="#">Home</a></li> 
           <li><a href="#">About</a></li> 
           <li><a href="#">Contact</a></li> 
          </ul>  
         </div><!-- /.navbar-collapse --> 
        </div><!-- /.container-fluid --> 
       </nav> 
       <div class="content"></div>   
     </body> 

    </html>

CSS

body { 
    padding: 70px 0 0 0; 
} 
html, body{ 
    height: 100%; 
} 
/* Top Navigation Bar */ 
.navbar-fixed-top { 
    background: #F7F7F7; 
    min-height: 0; 
    height: 45px; 
    padding: 5px 0; 
    margin-bottom: 0; 
} 
.navbar-header{ 
    height: 35px; 
    padding: 5px 0; 
} 
.content{ 
    width: 100%; 
    height: 450px; 
    background: rgb(255, 240, 240); 
}

fonte

2014-04-05 Elton

cambiare il corpo imbottitura per ..

body { 
    padding: 45px 0 0 0; 
}

http://www.bootply.com/127737

fonte

2014-04-05 23:46:10 ZimSystem

Hey che ha funzionato, hmm, come però? Quella imbottitura dovrebbe interessare la parte superiore del corpo? Non ho capito bene. Cosa fa effettivamente quel bit di codice a "body"? – Elton

Ah, ha la stessa altezza della barra di navigazione. Ora capisco. – Elton

Spazio al di sotto della barra di comando superiore fissa Bootstrap

risposta

Problemi correlati