Как сделать текст отзывчивым? - PullRequest
0 голосов
/ 08 января 2019

может кто-нибудь помочь мне сделать это отзывчивым. Я пытаюсь сделать так, чтобы он соответствовал экрану планшета и телефона. Но я не могу заставить его работать.

.slide-right {
  left: 38%;
  right:50%;
  top: 20%;
  position: absolute;
}
.image-desc {
  width: 750px;
  height: 100px;
  left: 23%;
  right:50%;
  position: absolute;
  top: 45%;
}
.image-desc h3 {
  font-family: 'Josefin Sans', sans-serif;
  font-size: 30px;
  font-weight: 700;
  color: 	#FF0000;
}
<div class="slide-right wow pulse" >
</div>
<div class="image-desc wow fadeInUp">
  <h3> KÖP AV OSS </h3>
 <h3> tel: 07071965063 </h3>
</div>

1 Ответ

0 голосов
/ 08 января 2019

Это пример кода того, что вы можете сделать. Добавьте этот код в ваш .css файл:

Размер шрифта рабочего стола

@media screen and (min-width: 1200px) {
  .image-desc h3{ font-size: 30px; }
}

Размер шрифта для планшетов и фаблетов

@media screen and (min-width: 992px) {
   .image-desc h3{ font-size: 20px; }
}

Размер шрифта телефона

@media screen and (max-width: 768px) {
   .image-desc h3{ font-size: 15px; }
}

Решает ли это вашу проблему?

...