How to Change Font Size of “Posted in” and “Tagged” Under Each Post

Try:

div.entry-utility {
   font-size: 0.8rem;
}

Thank you, George! That worked perfectly! I noticed while researching here that there are a lot of people who ask these types of font size questions and other CSS-related questions. To avoid such redundancy, and wasting time pouring through dozens and dozens of posts looking for an answer, is there a repository anywhere on the WordPress site where all of these obscure CSS codes can be found in one place?

George, another related question: Is there a way to add comments to the Additional CSS section so that I can remember what the code does? For example, in a regular HTML document, you can use <!– some text here –> to add invisible comments which do not affect the actual display in a web browser. Thanks!

NOTE: Those are actually double dashes, but this website converts them to one dash.

• This reply was modified 1 year, 1 month ago by Bill Kochman.

To avoid such redundancy, and wasting time pouring through dozens and dozens of posts looking for an answer, is there a repository anywhere on the WordPress site where all of these obscure CSS codes can be found in one place?

There isn’t… and there will be very limited use for such a repository. In fact, it’s likely to do more harm than good. And that’s because the “correct” CSS code to override an existing style can depend on numerous factors, including:

— The theme in use (always) — of which there are tens of thousands
— the plugins used (sometimes) — of which there are tens of thousands
— the website and page in question
— the content on the page (sometimes)
— whether the user is logged in or not (sometimes)
— etc

Given that many factors, and considering the sheer variety in customizations that users ask for, there are few instances where what works for one user will also work for another user.

The proper thing to do, and I’ll admit not many users may not have the technical skills to do this, is to use your browser’s developer toolbar to examine the HTML structure to know the appropriate CSS selector to use to override the desired style. This is exactly what I did to suggest the above code for you.

This requires a basic understanding of HTML and CSS, especially CSS selectors and CSS specificity calculations.

George, another related question: Is there a way to add comments to the Additional CSS section so that I can remember what the code does?

Below is a single CSS comment, which you can put above your edits:

/* This is a single-line CSS comment */

George, thank you very much for that additional info. It has been a real help to me. While I am pretty efficient with HTML, and while I do use CSS in most of my web pages, inspecting CSS code and altering CSS code via the Developer Tools is something I don’t have much experience with. However, after trying in Firefox — my go-to web browser — and then in Chrome, I finally figured out that I have to select something in the page, and then choose “Inspect” in the contextual menu. Now I am starting to understand exactly how to find specific CSS elements on a page in order to edit them in WordPress. Again, thank you!

Oh man! Am I having fun with this! I am discovering new things that I can do to adjust the appearance of my blog, thanks to you! You deserve a gold star, my friend! ??