html - Limiting links to appropriate text -
i trying make navigation menu footer. it's going quite well, both contain links. , having trouble limiting "link click area" small square around text. can point cursor several px next name in menu , still hit link. how fix or rather: how limit link, hover function, appropriate text?
doing in html , css!
footer {     font-family: moon flower bold;     font-size: 40px;     color: black;     background: rgba(0,138,99,0.4);     list-style-type: none;     padding-bottom: 45px;   }     footer ul {     list-style-type: none;    margin: 0;     padding: 0;   }     footer ul li {     display: inline-block;     float: left;     width: 200px;   }     footer a:visited,   a:link {     color: black;     text-decoration: none;   }     footer a:hover {     background-color: grey;     text-decoration: none;   }<footer>     <ul>      <li>© gruppe 3</li>      <li><a href="kontaktos.html">kontakt os</a></li>      <li><a href="links.html">links</a></li>    </ul>  </footer>
you can manage clickable space giving appropriate padding (in case, 0) link tag, eg.
html:
<a class='links' href='http//...'>link1</a> <a class='links' href='http//...'>link2</a> css:
.links{     padding: 0; } this result in making link text clickable.
Comments
Post a Comment