Agora que reparei que vc está usando **Bootstrap 4**, então vou reformular a resposta. Seu problema é que vc está usando as classes `mt-4` no Logo e `mt-2` na div `.meio` **`mt` na verdade significa `margin-top`** Para ler a documentação sobre o Espaçamento no Bootstrap 4 leia a documentação aqui: http://getbootstrap.com/docs/4.0/utilities/spacing/ Já o problema da margem abaixo do `<h2>` é que por default ele tem margens acima e abaixo. Vc pode ler mais sobre esses valores de "CSS Defaults" dos Browsers nessa resposta: https://pt.stackoverflow.com/questions/165937/o-que-%C3%A9-user-agent-stylesheets* (pesquise sobre user-agent para aprender mais)* Então basta remover essas classes para resolver seu problema. Veja no exemplo abaixo: <!-- begin snippet: js hide: false console: true babel: false --> <!-- language: lang-css --> header{ background-color: #ffc107; } h2{ margin-bottom: 0 !important; } .meio{ background-color: brown; } <!-- language: lang-html --> <link rel="stylesheet" type="text/css" media="screen" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous" /> <header class="container-fluid topo"> <img src="img/selo.png" class="img-fluid mx-auto float-right selo"> <img src="img/logo.png" class="img-fluid mx-auto d-block" alt="Logo DoUp"> <h2 class="text-center text-dark ">Seu curso de espanhol em 12 meses</h2> </header> <div class="meio ">gdfgfd</div> <!-- end snippet -->