Question: I have a page at [http://www.problemio.com/problems/problem.php](http://www.problemio.com/problems/problem.php?problem_id=49), 
and you see on the bottom-right I have a teal image. It is really a link and in that link I can't seem to get the text color to appear white.

Here is my CSS:

```
.button 
{
  display: block;
  background: #4E9CAF;
  padding: 10px;
  text-align: center;
  border-radius: 5px;
  color: white;
  text-color: white;
  font-weight: bold;
  text-decoration: none;
}

a:button.visited 
{
  display: block;
  background: #4E9CAF;
  padding: 10px;
  text-align: center;
  border-radius: 5px;
  color: white;
  text-color: white;
  font-weight: bold;
  text-decoration: none;
}

```

and here is how I make the link with HTML:

```
<a class="button" id="follow_problem" href="#" title="...">Follow Problem</a>

```

Any idea what is going wrong and why the color of the link isn't white?

Answer: 
It appears that you're trying to override the styling of the `a:link` class Try:

**Option 1:**

Here is the class you're trying to override:

```
a:link {
    color: #3686A7;
    text-decoration: none;
}

```

You need to add `!important` to the end of your style declaration:

```
.button {
    color: white !important;
}

```

**Option 2:**

You could further define the `a:link` class rules:

```
a:link.button {
    color: white;
}

```
That's because you have another class in common\_elements.css that has higher priority than .button

```
a:link 
{
    color: #3686A7;
    text-decoration: none;
}

```

Try making your .button more prioritized by `!important`