Блог

Иногда между диапазоном и нижней границей возникает странное пространство. Особенно при просмотре на мобильном устройстве. Вы можете увидеть скриншот здесь:

Код

 .heading {
  text-align: center;
  border-bottom: 2px solid #fb7a6d;
  text-transform: uppercase;
  margin: 18px 0;
  clear: both;
}

.heading span {
  display: inline-block;
  background-color: #fb7a6d;
  color: #fff;
  padding: 3px 16px;
}

@media only screen and (max-width: 479px) {
  .heading {
    padding: 2px 25px;
  }
}  

 <h2 class="heading"><span>Price and release date</span></h2>  

 @media only screen and (max-width: 479px) {
  .heading {
    padding: 2px 25px 0px 25px;
    //padding: 0px 25px 0px 25px;
  }
  

 @media only screen and (max-width: 479px) {
    .heading {
        padding: 2px 25px 0 25px;
    }
}
  

Добавьте margin-top:-1px; .heading span .