Question

I’m creating a “compound” link using link_to. The link text has a prefix portion formatted in one CSS style, and a root portion formatted in a different CSS style. For example:

preprocess

I’ve been able to crudely achieve this with two, back-to-back link_to statements:

<div class="dual-format-link">
    <%= link_to 'pre', compound_path, :class => "prefix-style" %><%= link_to 'process', compound_path, :class => "root-style" %>
</div>

Unfortunately the roll-over affect clearly shows that these are two different links, just arranged side-by-side. The fact that it is not a single, unified link causes user confusion.

I tried putting HTML in link_to‘s first argument but it is displayed as raw HTML.

Is there a way to have link_to do this? Are there alternatives to link_to that would work?

Answer 1

You have to tell Rails that the html is okay to render as html instead of escaped plain text by using html_safe:

<div class="dual-format-link">
    <%= link_to '<span class="prefix-style">pre</span><span class="root-style">process</span>'.html_safe, compound_path %>
</div>

See http://yehudakatz.com/2010/02/01/safebuffers-and-rails-3-0/ for more information.