Adnan Cejvan
Adnan Cejvan

Reputation: 83

How to make the text responsive?

can someone help me to make this responsive. Im trying to make it fit an tablet and phone screen. But i cant make it work.

.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>

Upvotes: 0

Views: 81

Answers (1)

Gregdebrick
Gregdebrick

Reputation: 571

This is a code example of what you can do. Add this code to your .css file :

Desktop font size

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

Tablets & phablets font size

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

Phones font size

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

Does this solve your problem?

Upvotes: 2

Related Questions