How to control font size in table headings?

MichalMolka

I would like to know how to control font size in table headings?
They look strange on mobile view and are too large: http://i.imgur.com/MTO4PBL.png
Here is the link to the website: http://skroc.pl/b8a48\

Albert

Hey,

did you tried to use Decrease Fonts option under Theme options > Responsive > General section?

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

MichalMolka

Yes.
I have this option set ON all the time.
http://i.imgur.com/0Rknjoz.png

Albert

Ok, thanks. So the problem is related with your custom css:

.NaglowekTabeli {font-size:30px;color:#ffffff;text-align:center;vertical-align:top}

So or you need to wrap above css into @media rule for screens larger than 1240px or you need to split above css to have the font size separately and then separated font size, wrap into right @media rule. All @media rules you can find under responsive.css section but for more details about how it works, please check http://www.w3schools.com/cssref/css3_pr_mediaquery.asp

An example of it's usage would be:

@media only screen and (min-width: 1240px) {
    .NaglowekTabeli { font-size: 30px; }
}

Or you can also keep above css and use the following to decrease these headings on mobile devices with css:

@media only screen and (max-width: 767px) {
    .NaglowekTabeli { font-size: 16px; }
}

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

MichalMolka

It turnet out it's my fault. I forget about this my code. Thank you for verification of this problem.

If I disable this code, font size comes back to normal size and color gray.
How to change font color?

Albert

Do you mean font color of just the headings (th) in table? If that's what you mean, you need to use custom css to change it's color:

.style-simple table:not(.recaptchatable) th { color: #FFF !important; }

Learn more: Video Tutorials | How To | FAQ Vote on what comes next