<button> does not work in Firefox within a Wordpress theme

Asked

Viewed 530 times

0

I am creating a button inside a Wordpress theme, but the same does not work in Firefox, already in Chrome and IE works without any problem.

My button:

<button class="faleconosco"><a class="texto_faleconosco" href="https://www.google.com">GOOGLE</a></button>
  • There is an error generated in the Firefox console?

  • I tried to look at the console and there is no error when clicking the button. Loading the page displays a JS error, see: Empty string passed to getElementById(). jquery.js:2:0

1 answer

1

To my mind, a <button> is rent and act quite different than a <a>, this being a link. It looks like IE and Chrome are interpreting your HTML in a way that ends up giving the desired result. Obviously Firefox does not interpret the same way.

If you want a link that has the appearance of a <button> in the browser, it is better not to use the <button>, and simply use a CSS to change the appearance of <a>. Something like that:

HTML

<a class="button" href="https://www.google.com">GOOGLE</a>

CSS

a.button {
    -webkit-appearance: button;
    -moz-appearance: button;
    appearance: button;

    text-decoration: none;
    color: initial;
}

Inspired of that reply in Soen

  • If by chance I exchange <button> for a <div> works pretty, but I do not want to modify the organization of the theme. The entire theme uses the <button>.

  • You mean all the <button>s the site does not work in Firefox? Or just the one that is modifying?

  • Only the modified one that doesn’t work.

  • The next question would be: is it more important to have the appearance of a button, or was one <button>?

  • Yes, it’s the bootstrap button, but I added some CSS formatting.

  • Got it. If it’s bootstrap, it’s just putting a class="btn" in the <a> that will style like a button

  • Look at this link: http://stackoverflow.com/questions/8772520/button-link-doesnt-work-in-firefox-ie

Show 2 more comments

Browser other questions tagged

You are not signed in. Login or sign up in order to post.