I am new to CSS but have read about specificity and thought I understood it but something is obviously not clicking.
I am trying to modify the appearance of some items on a custom taxonomy template and having some troubles. In Chrome Inspect Element it shows my new CSS class/ID but the values do not override the parent values.
Here is a sample of the code:
default for the child theme
Code:
h1,
h2,
h2 a,
h2 a:visited {
color: #444;
font-family: 'Droid Sans', Tahoma, Verdana;
font-size: 30px;
line-height: 36px;
}
My addition
Code:
.taxonomy-template h2,
.taxonomy-template h2 a,
.taxonomy-template h2 a:visited {
font-size: 20px;
font-weight: bold;
margin: 5px 0 2px 0;
padding: 5px;
}
site link
Any CSS experts see what I am missing?