CODEWITHSUNDEEP
htmlcssfooter
Anjali Chaturvedi
Anjali Chaturvedi

Reputation: 1

Unnecessary space below footer

So I am trying to add a footer but it has unnecessary space of 2 lines in the end and that too in the background color of the page. How do I fix that?

footer {
    text-align: center;
    background-color: orange;
    margin-bottom: -200px;
    height: 5em;
}

.contact {
    padding: 0px;
}

.contact a {
    color: black;
    margin-top: 30px;
}  

    
<footer>
  <div class="container contact">
    <div class="row">
      <div class="col-md-12 align self-center">
        <p> Made with ❤ by Team PitchTeen </p>
        <a class="contact-link" href="mailto:[email protected]">[email protected]</a>
      </div>
    </div>            
  </div>
</footer>

Upvotes: 0

Views: 47

Answers (1)

zerbene
zerbene

Reputation: 1492

If with "unnecessary space of 2 lines in the end", do you mean the "padding" bottom after the link, you can just remove height from footer CSS Properties, like this:

footer {
    text-align: center;
    background-color: orange;
    margin-bottom: -200px;
    /*height: 5em;*/
}

/* useless too now
.contact {
    padding: 0px;
}*/

.contact a {
    color: black;
    margin-top: 30px;
}  
<footer>
  <div class="container contact">
    <div class="row">
      <div class="col-md-12 align self-center">
        <p> Made with ❤ by Team PitchTeen </p>
        <a class="contact-link" href="mailto:[email protected]">[email protected]</a>
      </div>
    </div>            
  </div>
</footer>

Upvotes: 1

Related Questions