Meta Stack Exchange is where users like you discuss bugs, features, and support issues that affect the software powering all 158 Stack Exchange communities.

What is meta?
Here's how it works:
  1. Any Stack Exchange user can ask a question
  2. The community provides support, votes on ideas, and reports bugs
  3. Your voice helps shape the way Stack Exchange operates

This question already has an answer here:

I find the .youarehere a styling for the main navigation links causes the text to be a little difficult to read on the also-blue header background. Could we give it a little bit of background colour or something else that would provide more contrast?

For example:

contrasted youarehere link

which is the product of the following CSS*:

.nav ul li {
    margin: -2px 10px 0 0;
    padding: 5px;

.nav ul li.youarehere {
    background-color: rgba(0, 80, 112, 0.25);
    border-radius: 5px;

.nav ul li.youarehere a {
    color: #A1E9FF;

*For bonus points, also reduce the line height for the codeblocks!

share|improve this question

marked as duplicate by Ilmari Karonen, Tim Stone, Community Apr 8 at 23:36

This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.

+1 just for the title! – Amal Murali Apr 17 '14 at 4:24
Whereever I go, there I am. – Shog9 Apr 17 '14 at 4:24
Looks like this has now been fixed. I'd suggest closing this as a duplicate of the request that actually got implemented (even though it's newer). – Ilmari Karonen Apr 8 at 23:28

I've added something very similar to the CSS rules suggested above to the Stack Overflow Unofficial Patch v1.16. The specific rules I ended up using are:

.nav ul li.youarehere a {
    display: inline-block;
    padding: 5px;
    margin: -5px;
    border-radius: 5px;
    background-color: rgba(0, 80, 112, 0.25);
    color: #A1E9FF;

(The main advantage of re-styling only the a elements, besides letting me combine everything into a single CSS rule, is that it avoids having to mess with the existing padding and margin rules on the li elements.)

The re-styled navigation bar looks like this1:

    Screenshots of restyled meta.SE navigation bar

1) Animation only for illustrative purposes. Actual navigation bar will not be animated (except if you keep clicking the links to make it look like it is).

share|improve this answer

Not the answer you're looking for? Browse other questions tagged .