How do I match tags in theme css to customize

  • Unknown's avatar

    I am trying to modify color and font of various lines in the posts or main part of the blog as well as the widgets. I can view the theme’s css but is there an easy way to determine which tag (i.e. main, hr, content, content input, etc.) each line used on the theme is other than trial and error? For example, which tag controls the “Hello World” vs. the “posted by” line? Right now I am cutting an pasting each tag from the theme’s css into my customized css and changing it’s color just to see which line when I preview was changed.

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar

    You need to view the source code for the page you are working on and then find the element you want to change, which is typically doing to be in a “div” tag and the CSS class or ID will be specified in the opening div tag similar to this:

    div id="content">

    ids will start with # in the CSS while classes will start with a period ( . ).

    If you are using Firefox as your browser you can get the Firebug add-on which makes things much easier as you get a split window at the bottom that shows the HTML on one side and the CSS on the other. Take a half hour or so to get acquainted with it and it will make things much easier for you.

  • The topic ‘How do I match tags in theme css to customize’ is closed to new replies.