Where do you increase the comment font size ?

Question

Can some tell me where I increase the comment font size its to small

Answer 1

Change the font size of the class qa-c-item-content in your theme's stylesheet (usually qa-styles.css). There should be a definition like this:

.qa-c-item-content {
  font-size: 14px;
}

Change the font size to whatever you like and save the file.

Comments

I have two files But I have no ideal what to change its all different to what I am use to saying  things like font-size: 0.875em   what I want to change is the font size to the section where you leave the comment like iam doing now..

Answer 2

Hello @Methen.

Each theme uses its own stylesheets (files where the appearance of the website is set up) and changing comments font size depends on the theme the website uses. The following steps assume your Question2Answer site uses SnowFlat, like the website we're on right now:

Step 1: Open qa-theme/SnowFlat/qa-styles.css with a text editor and scroll down to line 2801. The surrounding lines of code should looks like this:

.qa-c-item-content {
    font-size: 14px;
}

Currently, this CSS rule declares comments are 14px tall.

Step 2: Replace 14px with de desired font size. Let's say the desired size is 16px. After you carry this step out the lines of code should be pretty similar to these:

.qa-c-item-content {
    font-size: 16px;
}

Step 3: Save modifications.

Web browsers tend to cache (save for later use, saving bandwidth and speeding up page load) stylesheets and your modifications are not reloaded instantly  so a quick way to check if it works is visiting your website in a incognito window. If comment size is up to date then you are all set.

However, there is still an issue though: A user's browser which has already visited the website will not know that the stylesheet has been updated and will not download the latest one. Q2A uses a technique called cache busting to handle this issue; in this case, the version number that Q2A adds to the stylesheet link needs to be updated; for doing this, open qa-include/qa-theme-base.php  with a text editor and go to line 365 and modify it:

public function css_name()
{
    return 'qa-styles.css?' . QA_VERSION;
}

so that it looks like this:

public function css_name()
{
    return 'qa-styles.css?' . QA_VERSION . '.1';
}

Whenever you add/remove/update this stylesheet, the number 1 should be bumped as 2, then 3, and so on.

Unfortunatelly, the downside of this approach is that all your modifications will be lost by the time the website is updated with a new version of Question2Answer. To prevent that from happening override the CSS rule I mentioned above in a new stylesheet, added in a new plugin:

1. Create and install a plugin
2. Add a layer to include a stylesheet which overrides the SnowFlat CSS rule

---

Tidbits

With Firefox web browser for desktop you can have a look at the CSS rules of a website and play with them by pressing Ctrl + Shift + C, hovering the pointer over the HTML element you're interested in, clicking on it, and then checking in the panel that pops up how CSS rules are applied in real time.

---

I hope this information is useful. If you have any question about this subject, please leave a comment below or update your question with more details.

Have a nice day!

Comments

Hey sorry for the long reply I use the snow theme and I have looked and do not see that when I go to search  for it I find 2 entry's  but there is no number to  change any way I can sens you  a copy of  the file so you can take a look ?