How to Put or Wrap Button Tag as a Nested Child Element inside Anchor (a) Link Tag to Make it Clickable Using HTML5

Thanks for reading my article first. How to Put or Wrap Button Tag as a Nested Child Element inside Anchor (a) Link Tag to Make it Clickable Using HTML5 We are going to learn more about this in this article. Let’s go into the article

The onclick event attribute works when the user clicks on the button. When the mouse clicked on the button then the button acts like a link and redirects the page into the given location.

How to Put or Wrap Button Tag as a Nested Child Element inside Anchor (a) Link Tag to Make it Clickable Using HTML5

index.html

<!DOCTYPE html>
<html>
    
<head>
    <title>
        Create an HTML button that
        acts like a link
    </title>
    
    <!-- Style to create button -->
    <style>
        .GFG {
            background-color: white;
            border: 2px solid black;
            color: green;
            padding: 5px 10px;
            text-align: center;
            display: inline-block;
            font-size: 20px;
            margin: 10px 30px;
            cursor: pointer;
        }
    </style>
</head>

<body>
    <h1>GeeksforGeeks</h1>
    
    <!-- Adding button inside the link tag -->
    <a href='https://ide.geeksforgeeks.org/'>
        <button class="GFG">
            Click Here
        </button>
    </a>
</body>

</html>

Read Also: How to Disable or Turn on/off HTML5 Form Fields Autocomplete Suggestions in Browser

Final Words

How to Put or Wrap Button Tag as a Nested Child Element inside Anchor (a) Link Tag to Make it Clickable Using HTML5 We hope this article solves all your doubts. If in doubt let me know.

Hi, I'm Ranjith a full-time Blogger, YouTuber, Affiliate Marketer, & founder of Coding Deekshi. Here, I post about programming to help developers.

Share on:

Leave a Comment