Different font sizes on the side bar (3 posts)

  1. Louie Reyes
    Posted 2 years ago #

    can someone show me how to change the font on my widgets, I want to use a different font for every subject or widget. I'm still new to this, I apologize if I posted this problem in the wrong thread. Thank you very much in advance.

    the website is http://www.boxpinoy.com/civil-service-reviewer/

  2. Michael
    Forum Moderator
    Posted 2 years ago #

    each widget has its unique CSS id;
    for example the top widget has #top-posts-3

    you can either use a browser inspection tool to find those CSS ids, or look into the source code of the page in the browser;
    example line from the top wdget:
    <aside id="top-posts-3" class="widget widget_top-posts"><h3 class="widget-title">Top Posts & Pages</h3>...

  3. Pioneer Web Design
    Posted 2 years ago #

    In your case, each widget has a unique CSS id. Example:

    <aside id="top-posts-3" class="widget widget_top-posts">

    Above is from the top widget output HTML. The unique id is 'top-posts-3'.

    Each widget then uses basic elements, such as ul and li.

    #top-posts-3 ul li {
    //your CSS goes here//

    Add per above example to your child theme stylesheet.

    To discover what CSS is output by your theme, use a web inspection tool such as Firebug: http://getfirebug.com/ , Chrome Inspect Element: https://developers.google.com/chrome-developer-tools/ or Internet Explorer 9+ F12 Dev. Tools: http://msdn.microsoft.com/en-us/library/dd565627(v=vs.85).aspx#csstool

    There are others.

    When editing CSS, use a Child Theme
    Custom CSS Plugin, or Theme provided custom CSS option.
    Edits to parent themes are lost on theme update.

    Learn CSS: http://www.w3schools.com/css/

Topic Closed

This topic has been closed to new replies.

About this Topic