6

I have a link in my .rst file that looks like

Click me! <../link_reference.html>

This renders as Click me!. However, I want to add a CSS class to it, so that it'd look like Click me!.

I added the line below to the top of my RST file:

role:: example

Then I changed my link out to look like this:

Example: Click me! <../link_reference.html>

However, this RST renders as <span class="problematic">:example:Click me! <../link_reference.html>_</span> instead. :(

I thought using .. role:: was the best way to add CSS to text in RST. Is there something special I need to do for links?

mzjn
  • 48,958
  • 13
  • 128
  • 248
LNA
  • 1,427
  • 3
  • 24
  • 37

1 Answers1

7

This gave me some trouble as well. This solution is not great but I was able to do what I needed so hopefully it helps you. It basically adds a div around the link with your class so you can target the and style the link. Depending on what you're doing you'd have to style the div as well.

RST code:

.. container:: myclass

    `google <www.google.com>`_

Output:

<div class="myclass container">
   <a class="reference external" href="www.google.com">
       google
   </a>
</div>
Suriyaa
  • 2,222
  • 2
  • 25
  • 44
anthony-dandrea
  • 2,583
  • 7
  • 26
  • 46
  • Is there an alternative usable for span to avoid styling of whole paragraph? – matousc May 04 '17 at 15:38
  • 1
    @matousc This post seems to have some information on using a span with a class. Might be worth a look. http://stackoverflow.com/questions/12900626/applying-css-and-roles-for-text-blocks-instead-of-inline-spans-in-sphinx – anthony-dandrea May 04 '17 at 17:17