Search code examples
htmlcsshyperlinkhref

CSS links don't work properly

the links in "request" div don't appear properly. For links in this div in style.css there is the following code:

.header .request a span{border-bottom:1px dotted}.header .request a:hover span{border-bottom:0}

Proof: berdyanskaya56.ru

On the page while link is hovered she becomes underlined. In comparison, in .css clearly stated that it should be none-decorated. How can I fix this?

UPD: -> goal: make links in div "request" dotted-underlinead while unhovered and non-underliened while hovered. All attributes of style of the links should be written in .css rather than in html (don't write style="text-decoration:none" in index.html).

-> present situation: link is dotted-underlined, but it becomes underlined (___) instead of non-underlined while hovered.

Solution

  • This work fine. Just add 

    div.header div.request a {
    text-decoration: none;/*add this*/
}


    .header .request a span {
  border-bottom: 1px dotted
}
.header .request a:hover span {
  border-bottom: 0
}
div.header div.request a {
  text-decoration: none;
}
    <div class="header">
  <div class="request">
    <a href="#">
      <span>sadsad</span>
    </a>
  </div>
</div>