CSS is blocking my button from redirecting to a new website

the following code is not redirecting me to a different site
...
      <div class="button-wrap left tooltip login-button">
            <a href="http://mail.yahoo.com" class="button dark"><span class="button-icon login"></span>Sign In</a>
      </div>
....

below is the complete header section:

            <div class="header-wrap">
                  <header class="site-header">
                        <div class="row">
                              <div class="site-logo left">
                                    <a href="./js/Academy – Learning Management Theme.html" rel="home">
                                          <img src="./images/oxford-white-logo.png" alt="My Blog">
                                    </a>
                              </div>
                              <!-- /logo -->
                              <div class="header-options right clearfix">                              
                                    <div class="login-options right">
                                                                        
                                          <div class="button-wrap left tooltip login-button">
                                                <a href="http://scenariousa.com/signin/" class="button dark"><span class="button-icon login"></span>Sign In</a>
                                          </div>
                                          
                                    </div>
                                    <!-- /login options -->                                                            
                              <nav class="header-navigation right">
                                    <div class="menu">
                                          <ul>
                                                <li class="page_item page-item-183"><a href="http://scenariousa.com/features/">Home</a></li>
                                                <li class="page_item page-item-2129 current_page_item"><a href="./js/Academy – Learning Management Theme.html">Programs</a></li>
                                                <li class="page_item page-item-2112"><a href="http://scenariousa.com/plans/">Testimonials</a></li>
                                                <li class="page_item page-item-2"><a href="http://scenariousa.com/sample-page/">Why Us</a></li>
                                                <li class="page_item page-item-601"><a href="http://scenariousa.com/contact/">Locations</a></li>
                                          </ul>
                                    </div>
                                    
                                    <div class="select-menu">
                                          <span>Menu</span>
                                          <select name="page_id" id="page_id" style="opacity: 0;">
                                                <option class="level-0" value="183">Home</option>
                                                <option class="level-0" value="2129">Programs</option>
                                                <option class="level-0" value="2112">Testimonials</option>
                                                <option class="level-0" value="2">Why Us</option>
                                                <option class="level-0" value="601">Locations</option>
                                          </select>
                                          
                                    </div>
                                    <!--/ select menu-->
                              </nav>
                              <!-- /navigation -->                                    
                        </div>                  
                  </header>
                  <!-- /header -->
            </div>
style.css
matthew phungAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Dave BaldwinFixer of ProblemsCommented:
Shouldn't that <span class="button-icon login"></span> be around the words Sign In ?  If there is no content in the <span>, there is nothing to click on.
0
Kyle HamiltonData ScientistCommented:
it's wrapped in the a, so it should still work.

you could have an element positioned on 'top' of the link, that is not visible - like a margin - could be obstructing the link. without seeing your page though it's not possible to know exactly what is going on. please post a link to the page.
0
matthew phungAuthor Commented:
Thank you for the replies...
Dave - I moved the "Sign In" text into the span and it still did not make a difference.

I uploaded the page to http://www.throwbackfestca.com/

Thank you for your help thus far.
0
Kyle HamiltonData ScientistCommented:
It's what I thought. Something about the button-wrap element is obscuring the link, I didn't investigate what exactly. However, you can fix it by wrapping the whole thing in a link instead. You might need to adjust some styles...

<a href="http://scenariousa.com/signin/" class="button dark active">
   <div class="button-wrap left tooltip login-button">
     <span class="button-icon login"></span>Sign In
   </div>
</a>

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
matthew phungAuthor Commented:
Thank you Kyle.... I played around with it and found that the tooltip was the cause. You just beat me to it. I appreciate your help!
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
CSS

From novice to tech pro — start learning today.