0

I have a post that has a title. I select like so =>

<h4><strong><%= link_to post.title, post, :class => "post-title" 
%></strong></h4>

I want to take away the text-decoration it gets by default form being a link. So i have this in my posts css =>

.post-title  {
text-decoration: none;
 }

I have tried selecting the text in all kinds of different ways and I just can't get that text-decoration to go away..

the html output is just the title of the post with standard text-decoration (blue color with an underline)

I checked safari web inspector and none of my rules were overridden.

Joe Smith
  • 244
  • 3
  • 12
  • what's the html output – Claudiu Creanga Jun 23 '15 at 23:12
  • Have you checked via web inspector this element to check whether this css rule is being overridden by the other rule? Btw try `a.post-title { text-decoration: none; }` – K.M. Jun 23 '15 at 23:14
  • 3
    You will get better help if you post the HTML that is generated, instead of the back-end code. Then remove the tags that aren't relevent to Css problems. – Jamie Barker Jun 23 '15 at 23:27

2 Answers2

0

It worked when I gave the erb an id of post-title and did the following in my css to select it:

a#post-title {
    text-decoration: none;
 }
Joe Smith
  • 244
  • 3
  • 12
-1

Try...

a.post-title {text-decoration: none;}

There's not enough CSS specificity in your selector.

There will be a browser or reset stylesheet applying the text decoration to anchor elements and your stylesheet applying it to anything with a class of 'post-title'. At the moment the anchor style is winning.

Example

a {text-decoration: underline} //Browser CSS
.post-title {text-decoration: none} //Your CSS

Both of those apply to...

a.post-title
Kevin Monk
  • 1,434
  • 1
  • 16
  • 23
  • Author declarations have more [importance](http://www.w3.org/TR/CSS21/cascade.html#cascading-order) than user agent declarations. And even if they had the same importance, a class selector has more [specificity](http://www.w3.org/TR/CSS21/cascade.html#specificity) than a type selector. – Oriol Jun 23 '15 at 23:41
  • True but If it's some kind of framework reset then it may be applied to a wrapper class. In which case the OP just needs to increase the specificity. See this fiddle - http://jsfiddle.net/gejxbt8n/ – Kevin Monk Jun 24 '15 at 00:02