How to override bootstrap css?

Question

I would like to use the tooltip function of Bootstrap 3 on my website (www.fischer-club.ch). I tried to override the margin-top value in my custom.css to better place the tooltip:

.tooltip.top {
  margin-top: -40px;
}

This doesn't work; the style from bootstrap.min.css remains.

Answer 1

Your code is fine but you have an error in custom.css file right before. .btn-anmeldung rule is missing a closing bracket:

/* Bouton Anmeldung sur la Homepage */
.btn-anmeldung {
  background-color:#777777;
  border-color:#555555;
  color:#FFFFFF;

/* Augmenter l'espace du tooltip de bootstrap */
.tooltip.top {
  margin-top: -40px;
  }

Add it and it works:

/* Bouton Anmeldung sur la Homepage */
.btn-anmeldung {
  background-color:#777777;
  border-color:#555555;
  color:#FFFFFF;
 }

/* Augmenter l'espace du tooltip de bootstrap */
.tooltip.top {
  margin-top: -40px;
  }