Making CSS rules for links in header more DRY

I want to implement the cleanest amount of CSS through proper use of inheritance. All links need to be a shade of white, so lets say #fff

HTML

  
    BruxZir
  
  
    ≡ 
  

CSS

.header {
  background-color: #333;
  color: #fff;
  height: 36px;
  width: 100%;
  line-height: 36px;
}

/* should be replaced with image */
.headerLogo {
  display:inline;
  font-size: 24px;
  line-height: 36px;
  padding-left: 6px;
}
.headerLogo a{ 
  color:#fff;
  text-decoration:none;
}

.headerMenu{
  float:right;
  font-size: 36px;
  margin-right: 6px;
}

.headerMenu a {
  /* needs the same rules for color, font-size, no text-decoration */
}

Here is my Codepen

I am thinking that since many of these rules will apply to the rest of the links in the header, I can set this up somehow for better inheritance. Also wondering if I would be better served using `s instead of `s for the logo and the menu?

The worst aspect of your code is the markup, not the CSS. Unless you need the div as an actual styling hook, you can safely discard it. After all, you're not styling it in any meaningful way (what you do have can just as easily be applied to the descendant tags).

    BruxZir
    ≡ 

However, the inclusion of semantic tags might be a better way to go:

    BruxZir
    
        ≡ 
    

StackExchange Code Review Q#39905, answer score: 7