[resolved] H1 Post Title is Same Size as H2 Sub-Heading (7 posts)

  1. Content Writer
    Posted 2 years ago #

    They're the same size despite the fact that the (h1) post title is 24px in the style template, and the (h2) sub-heading is 22px. Here is an example.

    How do I make the post title bigger than the sub-heading, which is what it is supposed to be?

  2. Instead of

    h2 { font-size: 22px; }


    h2 { font-size: 22px !important; }

    According to my browser this should fix your issue.

  3. Content Writer
    Posted 2 years ago #

    That did the trick.

    Thank you so much, Patrick!

  4. Glad I could help. Without the "!important" other CSS, related to h2, had precedence over your custom code.

    Please go ahead and mark this topic as resolved.

  5. Content Writer
    Posted 2 years ago #


  6. Andrew
    Forum moderator
    Posted 2 years ago #

    Please don't use "!important" styles that govern how text is displayed.

    People with poor vision have the ability to upload their own stylesheet and override the current website's styles.

    If the website has "!important" and/or inline styles then they become a lot harder to override, which means these user stylesheets cannot work properly.

    You don't have to use "!important" styles, just use more specific CSS selectors.

    The real issue here is that you're editing the stylesheets directly. Are you aware that modifying the theme's files like this will lead to those modifications being erased when the theme updates?

    If you're just wanting to make CSS changes then do so in a Custom CSS plugin. In fact in that Custom CSS plugin, in the case of styling your "h2" element you don't even need to use more specific CSS styles. Just put the CSS you tried before into its section of the dashboard:

    h2 { font-size: 22px; }

    The Custom CSS plugin is called after you load your stylesheet, so it takes precedence over your original styles.

  7. Content Writer
    Posted 2 years ago #

    Thanks for that info, Andrew. I installed the CSS plugin you recommended and changed the h2 code through that. The sub-headings are the right size now, as they were after I applied the "important" code, but now they're update friendly.

Topic Closed

This topic has been closed to new replies.

About this Topic