Button not going to link

[Harry Wordsworth]

Hello!

I am having an interesting little situation.
I was working on a site (mainly to learn CSS, javascript) and I ran into a small issue I can't figure out, especially since I've been able to get by more complex problems.

So I have a simple page with a button. You click the button and you go to another page (in my test example you go to google.com)
My original problem that I was going to post about was that for some reason the link in the page that comes up works in Microsoft Edge browser but it does not work in IE or the built in browser in eclipse.
in other words in Edge when you click the button it goes to google.com but in any other browser I had tested with, IE, and the browser in eclipse, clicking the button does nothing.
Same code tested but it works in Edge but not anywhere else.
However as I was writing this I tested a bit more and found it came down to a line of code.

<button class="button"><A href="http://www.google.com">first try</A></button>
Apparently this line is not valid. A warning message comes up in the Eclipse IDE but for some reason Edge browser allows it.

I changed things up to the below...
<A href="http://www.google.com"><button class="button">second try</button></A>

Now this works in every browser. When you click the link it goes to google.com. I tested it in IE, Edge and the eclipse IDE's browser.

The problem is, the reason I was using the original link like that was that I could take advantage of things like "visited links". In other words I want the text on the button to be a different color or shade if the user has already clicked that button.
That works the first way...<button class="button"><A href="http://www.google.com">first try</A></button>
In edge browser only and if I have something like "a:visited" set to a different color then the text color on the button will change.


but it does not work the second way...<A href="http://www.google.com"><button class="button">second try</button></A>

So even though I've solved the problem I had when I first sat down to write this, now I know why it's not working, I just am not sure how to get the functionality I want now. Any suggestions?

[Bear Bibeault]

If you just want it to act like a link, then use a link (just the element). You can style it to look like a button with CSS.

[Harry Wordsworth]

Thanks. that works. Basically just used my button "class"

.button {
blah, blah, blah
}

a:visited {
blah blah blah
}

and this gives me the result I was looking for. Thanks for the tip!
<A class="button" href="http://www.google.com">third try</A>

[Bear Bibeault]

My pleasure!