Rails link_to tag tag with styled glyphicon

Question

I am trying to use glyph icons that I have styled in my rails app.

I want to make the icon a link to another page, but can\'t use the standard bootstrap styling beca

Answer 1

Your problem is that you are using a:visited {text-decoration:none; background-color:transparent; color:grey;}; on your glyphicon css but they should be on your link

Try this:

<%= link_to page_path('messages'), class: "comment_link" do %>
  <span class="glyphicon glyphicon-comment"></span>
<% end %>

and then style your link, if you are using scss then:

.comment_link{
  .glyphicon-comment{
    vertical-align:middle;
    margin:auto;
    padding:10px;
    font-size: 2em;
    text-align: right;
  }
  &:hover, &:visited, &:active{
    text-decoration:none;
    background-color:transparent; 
    color:dark grey;
  }
}

Answer 2

You have to use " around the string, also need to call html_safe method on it.

<%= link_to "<span class=\"glyphicon glyphicon-comment\"></span>".html_safe, page_path('messages') %>

but a better and cleaner way would be

<%= link_to page_path('messages') do %>
  <span class="glyphicon glyphicon-comment"></span>
<% end %>