Question

I have a very similar problem as this
Twitter bootstrap displays button with greyed text
where I have a Twitter Bootstrap button btn-info with a drop down that after I clicked on a drop down item the text for the button is now grey and only shows as white when I hover over it. It never returns back to normal even if I stop the rails server and retart. If I go to a different browser(say I switch from Firefox to Chrome), the button’s text is white but then the problem re-appears as soon as I click on a drop down item.

I believe the problem didn’t start until after I ran a scaffold generator except I don’t have a Scaffold.css to delete as was suggested was the fix for Twitter bootstrap displays button with greyed text

Any ideas how to stop mysterious permanent gray color of text for button?

Here’s my button html

<span class="span3 btn-group">
    <a id="j_button" class="btn btn-info session_button dropdown-toggle" data-toggle="dropdown" href="#">
        Send to J location
        <span class="caret"></span>
    </a>
    <ul class="dropdown-menu">
        <li><a id='j_dropdown1' href="#">New issue</a></li>
        <li><a id='j_dropdown2' href="#">Add to existing</a></li>
    </ul>
</span>

with the only css that I added is

.session_button {
  font-size: 12px;
  font-weight: bold;
  padding-left: 8px;
  padding-right: 5px;
  padding-bottom: 0;
  padding-top: 0;
}

Answer 1

It’s because you’re actually using a link.

It only looks like a button because of the added class btn and btn-info which adds the twitter bootstrap styles. When you click on a link, the browser usually remembers that you already visited that link and shows you the visited state the next time you see it.

You might also want to add css styles to the visited state of the link to change it from being gray.

Assuming you want it to stay white, you can do so by adding the following:

.session_button:visited { color:#FFF; }

Also check out CSS selector for visited links.