T3 Community Discussion & Support

Let's build the best free Joomla template framework, together!
  1. philopin
  2. General Discussion
  3. Monday, 26 January 2015
  4.  Subscribe via email
Hello,

I have another question to your nice Framework.

I saw that on the site: http://www.t3-framework.org/ the Font sizes are responsive. Means when i resize my screen into a smaler one the fontsize of h1 will become smaler after the breakpoint ist reached.

But it is not working on my site :( and i don´t know why. I didn't set my h1 and others in a custom.css or so... I only used the calculated ones form variables.less with a base of 14px
The problem is that on my Joomla site http://sporttauchclub-leonberg.de/bilder2 the headings overlap when the screen gets smaler..

Thanks for your help!!!
Philopin
Comment
There are no comments made yet.
Accepted Answer
Accepted Answer Pending Moderation
0
Votes
Undo
Hi philopin,

Yeah, you can define font-size in responsiveness. For heading tag, you can use the sample format:

h1, .h1 {

font-size: 36px;

@media (max-width: 1199px) {
font-size: 30px;
}

@media (max-width: 991px) {
font-size: 20px;
}

@media (max-width: 767px) {
font-size: 18px;
}
}


For normal text, you can use the sample format:

.body { 

font-size: 14px;

@media (max-width: 1199px) {
font-size: 13px;
}

@media (max-width: 991px) {
font-size: 12px;
}

@media (max-width: 767px) {
font-size: 11px;
}
}


Regards
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # Permalink


There are replies in this post but you are not allowed to view the replies from this post.