Hi all quick question guys, very new to development.

I have the Div class below, with a Style, however, the hyperlink is not even working, how do I make the hyperlink work?

<div class="HlinkTitle" href="google.co.uk">TEST</div>

<style>
.HlinkTitle {
        padding-left: 100px;
        font-size: 15px;
        font-weight: bold;
        font-family: "Segoe UI Semibold", "Helvetica Neue", Helvetica, Arial, sans-serif;
color: red;
text-decoration: none;
}

</style>

CodePudding user response：

Try adding this inside of your div: <a href="https://stackoverflow.com" >Go to Stack Overflow</a> For example:

<div>
   <a href="https://stackoverflow.com" class="button">Go to Stack Overflow</a>
</div>
<style>
   .HlinkTitle {
   padding-left: 100px;
   font-size: 15px;
   font-weight: bold;
   font-family: "Segoe UI Semibold", "Helvetica Neue", Helvetica, Arial, sans-serif;
   color: red;
   text-decoration: none;
   }
</style>

CodePudding user response：

An href attribute can be used only on certain elements (a - anchor - area, base and link).

In your case I think you need to put it on an anchor element so that the user can click on it to go somewhere.

I don't know enough about the context to know whether you will also need to keep the div - in this case surrounding the anchor element. If you do this then at least some of the CSS styling needs to be moved from the div to the a element itself as browsers put default styling onto anchor elements (e.g. often a blue color and an underline).

.HlinkTitle {
  padding-left: 100px;
  font-size: 15px;
  font-weight: bold;
  font-family: "Segoe UI Semibold", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: red;
  text-decoration: none;
}

<div><a class="HlinkTitle" href="google.co.uk">TEST</a></div>

<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>