Styling colors in Rails 4 inside link_to, but inline styling not displaying correctly

Question

<%= link_to "Sign In", new_user_session_path, :method => :get, style: "color:white" %>
<h3>Read More - <%= link_to 'Article', action: :articles, style: "color: purple" %></h3>
<%= link_to 'Click to Read More About What People Are Saying About Us', action: :articles %>

So I have the above three lines of code in the body of an html.erb file.

The first "Sign in" shows up as white, as I want.

The second, "Article" link shows up as black! I wanted purple.

The third, shows up as gray. But I would like it to be white.

What exactly is my problem? I'm trying to learn rails and css simultaneously.

Below is my overarching scaffolds.css.scss file:

body {
  background-color: #fff;
  color: #333;
  font-family: verdana, arial, helvetica, sans-serif;
  font-size: 13px;
  line-height: 18px;
}

p, ol, ul, td {
  font-family: verdana, arial, helvetica, sans-serif;
  font-size: 13px;
  line-height: 18px;
}

pre {
  background-color: #eee;
  padding: 10px;
  font-size: 11px;
}

a {
  color: #000;
  &:visited {
    color: #666;
  }
  &:hover {
    color: #fff;
    background-color: #000;
  }
}

div {
  &.field, &.actions {
    margin-bottom: 10px;
  }
}

#notice {
  color: green;
}

.field_with_errors {
  padding: 2px;
  background-color: red;
  display: table;
}

#error_explanation {
  width: 450px;
  border: 2px solid red;
  padding: 7px;
  padding-bottom: 0;
  margin-bottom: 20px;
  background-color: black;
  h2 {
    text-align: left;
    font-weight: bold;
    padding: 5px 5px 5px 15px;
    font-size: 12px;
    margin: -7px;
    margin-bottom: 0px;
    background-color: #c00;
    color: #fff;
  }
  ul li {
    font-size: 12px;
    list-style: square;
  }
}

EDIT: Added Rendered HTML:

<a data-method="get" href="/users/sign_in" style="color:white">Sign In</a>


<h3>Read More - <a href="/articles?style=color%3A+purple">Articles</a></h3>
<a href="/articles">Click to Read More About What People Are Saying About Us</a>

Answer 1

The second link: You need to separate html_options from url_options:

 <h3>Read More - <%= link_to 'Article', {action: :articles}, {style: "color: purple"} %></h3>

Otherwise rails will create a link thinking that style: ... is an extra GET param to pass via url.

As with the last one it is hard to say, most likely your css instructions are overriden somewhere by another css file. Install firebug on your browser (if using FF/Chrome) or use developer tools (IE) to find where the final color for links is being set up.

Answer 2

I am pretty sure this code will work.
<%= link_to "button_name",{:controller => 'controller_name', :action => 'action_name'},{:style=>"color:#fff;"}%>