0

I've been writing some HTML code to develop a website. I want to have some buttons link to other parts of the page. The button is in a "Meet the Team" style. Here is the code:

<div class="column">
<div class="card">
 <div class="container">
  <img src="button1.png" alt="Button" style="width:100%">
    <div class="centered"><h1> Lorem Ipsum </h1></div>
    <p class="title">Lorem ipsum dolor sit amet, consectetur adipiscing 
    elit.</p>
    <p><button class="button">Button</a></button></p>
  </div>
</div>

I've tried to get it to link to a page but I can't find anything (I'm new to HTML). Maybe one of you can help? Thanks!

  • Possible duplicate of [How to create an HTML button that acts like a link?](https://stackoverflow.com/questions/2906582/how-to-create-an-html-button-that-acts-like-a-link) – Jon P Aug 30 '18 at 03:03
  • The `button` element is not really the right tool for the job here. Use `a` and style it like a button. See the linked duplicate for suggestions on how you can do this. By using `button` you break expected behaviors e.g : right click giving contextual menus and middle (scroll wheel) click opening in new window. – Jon P Aug 30 '18 at 03:09

2 Answers2

0

This is the best way to link other pages style a tag looks like button:

<a href="http://www.stackoverflow.com/">Click me</a>

Alternatives:

<button onclick="location.href='http://www.example.com'" type="button">
    www.example.com
</button>

Or

<form action="http://google.com">
    <input type="submit" value="Google" />
</form>
Jignesh Sanghani
  • 602
  • 6
  • 12
-1

Your button tag is not properly formatted, the </a> will break your html code. All you have to do is just pass href attribute to button.

 <p><button type="button" class="button" href="team-page.html">Button</button></p> 

http://www.tizag.com/htmlT/ is a very good starting point.

ibonly
  • 133
  • 1
  • 3
  • 10
  • Thanks for pointing that out, I will go for anchor tag instead then give it a button style. – ibonly Aug 30 '18 at 03:21