• Resolved jrothra

    (@jrothra)


    URL: https://www.johnrothra.com

    I’ve tried entering everything I can think of and it doesn’t impact the font size of the widgeted content in the footer. The font in the body is size 18px, line height 28px. I want the content in the footer widgets to be size 14px, line height 22px (maybe 21). However, it seems no matter what I put in the custom css file, the footer stays the way it is.

    Right now I’ve got this in the custom css, but according to Chrome’s elements bar (debugger), this is overridden by something, but I’m not sure what:

    .row.widget-area,
    .row.widget-area a {
        font-size: 14px;
        line-height: 22px;
    }

    How do I fix this?

Viewing 6 replies - 1 through 6 (of 6 total)
  • You just need a stronger rule for non links ??

    #footer .footer-widgets .widget, #footer .footer-widgets .widget a{
        font-size: 14px;
        line-height: 22px;
    }

    but you have an inline style here:
    <a style="margin-left:20px;font-size:1.1em;" href="https://www.johnrothra.com/how-to-be-saved/"><strong>How to be saved today</strong></a>
    so that link, and the one below, will not be affected, unless you add !important to the rules above, which, as side effect will affect the widget title also.

    Thread Starter jrothra

    (@jrothra)

    That made no different to the text ??

    I even cleared all caches and still it’s the same 18px as the body text. For some reason, it’s only following the body css found far above it in the css file (https://pastebin.com/eE85MbWr). I even tried adding !important next to it — no change. It’s like something is saying, “ignore that rule, follow the previous rule only” (I do not have !important next to the body css, so that’s not it).

    Thread Starter jrothra

    (@jrothra)

    BTW, I have the size set to 8px to exaggerate the difference temporarily for testing purposes.

    Also, I removed the inline styling, which caused the footer widget links to shrink to 8px (though the paragraph and li content is unchanged). I tested the css you provided by changing the font-size to 58, but there was no impact.

    this error:

    /* remove previous/next arrows from home page only */
    .home .carousel-control {
    /*    display: none ;
    }

    Basically you opened a comment but you haven’t closed it after the semicolon, so you include the closing brace into the comment block …

    Thread Starter jrothra

    (@jrothra)

    Oops. I can’t believe I did that. Sorry for all the posting over my own oversight.

    No problem, it happens ??

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Font size in footer – custom css not affecting it’ is closed to new replies.