Editing the H2 tag
-
Hi, I just want to change the visual of my h2 tag and it is somehow being overrided when I save and refresh the page. What I have is the following:
h2 { font-size: 20px; font-style: italic !important; }Can someone tell me why this isn’t working?
The blog I need help with is: (visible only to logged in users)
-
Hi,
Your given CSS is being overwritten by the another CSS so it is better to use “id”.
Give id to the tag you require to give CSS and make CSS style by the id as shown below.
CSS#header2 { font-size: 20px; font-style: italic !important; }H2 tag
<h2 id="header2">Your text <h2>Thanks,
Aakash Patel -
Hi Aakash, thank you! But is that the easiest way to do it, or can we find the code thats overriding it and use !important to work things out that way? It will be much more convenient in writing if I don’t have to go to the HTML and add an id and can just use the text editor.
-
Heads-up that !important should almost never be used in custom CSS. I explain why it should be avoided in this other thread.
What we need to do instead of adding a new ID and/or using !important is to target a more specific element.
So for example, if you’re trying to target h2 tags within the body of your posts, you’d use:
.entry-content h2 { font-size: 20px; font-style: italic; }Note that !important is not necessary, you don’t need to add an ID or class to your HTML, and we’re targetting a more specific element, which applies to h2 tags within the entry-content element only.
Learning how to target your site’s CSS will help you make certain design and layout changes. Here are some very helpful posts that will help you customize your site with CSS:
http://en.support.wordpress.com/custom-design/how-to-find-your-themes-css/
-
- The topic ‘Editing the H2 tag’ is closed to new replies.
WordPress.com Forums 