Link still underlined

Question

there were so many questions about that but none of them are helpful for me. I want normal links blue and underlined while the titles for articles should be red and without underline. This is the code:

a {

  color: #337ab7;
    text-decoration: underline;

}

.field.field--name-title{
    color: #fffff0;
    text-decoration: none;
}

I tried combine like: a.field.field--name-title and .field.field--name-title a but it doesn't work.

@EDIT Adding HTML, this is the DIV with the article:

<div class="views-row">


<article role="article" about="/de/link-test" class="node node--type-blog-entry node--promoted node--view-mode-teaser clearfix">
  <div class="node__container">
    <div class="node__main-content clearfix">
      <header class="node__header">

                      <h2 class="node__title">
              <a href="/de/link-test" rel="bookmark"><span class="field field--name-title field--type-string field--label-hidden">LINK TEST</span>
</a>
            </h2>

                        </header>

            <div class="clearfix text-formatted field field--name-body field--type-text-with-summary field--label-hidden field__item"><p>tu jest link <a href="www.example.com">www.example.com</a></p>
</div>
        <div class="node__links">
    <ul class="links inline"><li class="node-readmore"><a href="/de/link-test" rel="tag" title="LINK TEST" hreflang="de">Weiterlesen<span class="visually-hidden"> über LINK TEST</span></a></li></ul>  </div>

          </div>
  </div>
</article>

  </div>

Answer 1

You are targeting the wrong selector. .field.field--name-title is the span inside the anchor tag. Given the markup you provided, try this:

a {
  color: #337ab7;
  text-decoration: underline;
}

.node__title a {
  color: #fffff0;
  text-decoration: none;
}

Better still would be to give the anchor tag a class and target that.