My Button can't be clicked on Internet Explorer

15 replies
  • WEB DESIGN
  • |
Hello Warriors,

Everything works perfectly fine on other browsers until I checked it on my installed Internet Explorer. I am not sure if the version of my IE is the main issue here.

I created a sample for you to see. Please check this on your Internet Explorer if you have the chance. http://thesuperchargedagency.com/buttons.html , kindly let me know whether the button is clickable or not there on your end.

Let me share you the codes. Please see the Bold ones.
______________________________

<table width="327" border="0">
<tr>
<td width="321" align="left" valign="top"> <font color="#8cbf40" size="4" face="Century Gothic"><strong><center>
Buttons Can't be clicked on my IE
</center></strong></font>
<dl>

<dd><font color="#000000" size="3"> </font></dd><font color="#000000" size="3">
<dd><img src="http://www.philippineonlineservices.com/wp-content/uploads/2012/06/blue-dot-smaller15.jpg"> <font face="Century Gothic" color="#000000" size="3">Please help me on this....</font></dd>
</font>
</ul>
<br/>

<div align="left">
<style type="text/css">
.some {
background-color:#63a4b5;
}

.some:hover {
background-color:#002c3f;
}
</style>

<a href="http://warriorforum.com" title="Sample Destination Page" style="text-decoration:none">
<table width="267" >
<tr>
<td width="259" align="center">
<div style="border:single 5px #63a4b5;">
<div class="some" style="border:double 4px #ffffff; color: #fff; padding: 5px; font-family:Myriad Pro; font-size:16px">Installation Details and Pricing &gt;&gt;
</div>
</div>
</td>
</tr>
</table>
</a>


</div>

</td>
</tr>
</table>

_______________________________

Could this has something to do with my added <style type="text/css"> ?

I really need to have this "mouse hover effect" on my button without using images.

Your help will be very much appreciated.

Thanks,
Louie Tugas
#button #clicked #explorer #internet
  • Profile picture of the author eternalwarrior
    Hey Louie,
    The button is not working in IE.
    {{ DiscussionBoard.errors[6533336].message }}
    • Profile picture of the author magiclouie
      Originally Posted by eternalwarrior View Post

      Hey Louie,
      The button is not working in IE.
      Thanks for the time for checking it out, pal

      Hopefully, I could get this sorted out.
      {{ DiscussionBoard.errors[6533752].message }}
  • Profile picture of the author Go4DBest
    Could you try to put the <a href code before the <div align="left">
    <style type="text/css">
    .some {
    background-color:#63a4b5;
    }

    .some:hover {
    background-color:#002c3f;
    }
    </style>
    Signature
    We setup and design wordpress sites using the Divi theme for roughly 200 USD. Let's talk.
    {{ DiscussionBoard.errors[6534309].message }}
    • Profile picture of the author magiclouie
      Originally Posted by Go4DBest View Post

      Could you try to put the <a href code before the <div align="left">
      <style type="text/css">
      .some {
      background-color:#63a4b5;
      }

      .some:hover {
      background-color:#002c3f;
      }
      </style>
      Still not working, thanks for the input though!
      {{ DiscussionBoard.errors[6534950].message }}
  • Profile picture of the author Mattds
    I have had a similar problem. I solved this by adding a positive z-index to the element in your css

    .some { background-color: #002c3f; z-index: 50;}
    {{ DiscussionBoard.errors[6535417].message }}
    • Profile picture of the author Mattds
      ok iv had a good look at your code and i have fixed it like this

      <div style="padding: 5px; border: 4px double rgb(255, 255, 255); color: rgb(255, 255, 255); font-family: Myriad Pro; font-size: 16px;" class="some"><a href="http://www.warriorforum.com">Installation Details and Pricing &gt;&gt;</a>
      {{ DiscussionBoard.errors[6535518].message }}
      • Profile picture of the author magiclouie
        Originally Posted by Mattds View Post

        ok iv had a good look at your code and i have fixed it like this

        <div style="padding: 5px; border: 4px double rgb(255, 255, 255); color: rgb(255, 255, 255); font-family: Myriad Pro; font-size: 16px;" class="some"><a href="http://www.warriorforum.com">Installation Details and Pricing &gt;&gt;</a>

        You ROCK!!!!!

        I can't thank you enough for this, pal. Your codes are perfect. You got it sorted out.

        If only I could click the Thanks Button many times, I'll certainly do that.
        {{ DiscussionBoard.errors[6536015].message }}
    • Profile picture of the author magiclouie
      Originally Posted by Mattds View Post

      I have had a similar problem. I solved this by adding a positive z-index to the element in your css

      .some { background-color: #002c3f; z-index: 50;}
      Okay pal, let me try this.

      I'll let you know....
      {{ DiscussionBoard.errors[6535939].message }}
  • {{ DiscussionBoard.errors[6536043].message }}
  • Profile picture of the author BillyW
    Hey Mattds, how did you figure that out? What was causing the problem? I am trying to learn as much as I can and would be very appreciate if you could explain.
    Signature
    Qosso.com - Exceptional Branding At Affordable Prices
    {{ DiscussionBoard.errors[6538100].message }}
    • Profile picture of the author magiclouie
      Originally Posted by BillyW View Post

      Hey Mattds, how did you figure that out? What was causing the problem? I am trying to learn as much as I can and would be very appreciate if you could explain.
      I think my double <div tags are causing the problem. As you can see on my original codes, I have two div tags which have the border color attributes.

      What he did, he fused them into one but still have the same output. I normally used 2 images for my button to have this mouse hover effect, so I thought of doing that effect without images. And thanks to Mattds.......
      {{ DiscussionBoard.errors[6539528].message }}
  • Profile picture of the author BillyW
    I see. It's odd how it works on the other browsers. I don't care for IE too much. It's too quirky.
    Signature
    Qosso.com - Exceptional Branding At Affordable Prices
    {{ DiscussionBoard.errors[6540892].message }}
    • Profile picture of the author magiclouie
      Originally Posted by BillyW View Post

      I see. It's odd how it works on the other browsers. I don't care for IE too much. It's too quirky.
      IE is really a pain, however we still need to consider this browser. Hence, cross browsing is very important.
      {{ DiscussionBoard.errors[6541668].message }}
  • Profile picture of the author lsargent
    Yeah, you just weren't linking the text to anything. You always gotta wrap your href tags around anything you're trying to link, whether it be text or an image.
    {{ DiscussionBoard.errors[6542630].message }}
    • Profile picture of the author magiclouie
      Originally Posted by Logan Sargent View Post

      Yeah, you just weren't linking the text to anything. You always gotta wrap your href tags around anything you're trying to link, whether it be text or an image.
      I hope you had checked the posted codes on my original thread. The href tags wrap around my entire table codes. It works pretty well on other browser but not in IE.

      Anyway, thanks to the man who has helped me. It's already fixed and thanks to your reply post.
      {{ DiscussionBoard.errors[6545754].message }}

Trending Topics