Foo
Foo

Reputation: 319

Hyperlinks do not work

I have the following code in the head section of my website. I have read this question but my css does not seem to have a z-index.The image and the like box display but nothing happens when I click them or I should say that the hyperlinks do not work. Please help out. Thanks

  <div class="content-pad" style="float:left;">               
                <a href="mailto:[email protected]"><img src="http://www.startupsandfinance.com/wp-content/uploads/2012/06/Advertise-here-728x90.png" width="728" height="90" /></a> 
                <span class="widget-pad" style="margin-left:25px;"> 
                <iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FStartupAndFinance&amp;width=290&amp;height=62&amp;colorscheme=light&amp;show_faces=false&amp;border_color&amp;stream=false&amp;header=true&amp;appId=384169901601437" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:290px; height:62px;" allowTransparency="true"></iframe> 


                </span>
                </div>
                </div>

Upvotes: 1

Views: 109

Answers (2)

Nimphious
Nimphious

Reputation: 5039

The problem is that .content has no height, and pointer events are not reaching the iframe because it is outside of it's parent element's boundaries.

Adding this rule to whatever else you have for your .content selector.

div.content {
    height: 120px;
}

Upvotes: 1

Nobita
Nobita

Reputation: 23713

When you click on the header image, the default email application is launched as you have an href to:

mailto:[email protected]

You can check it out live in here:

http://jsfiddle.net/MSRXU/

So, is something else that you haven't write the code for.

After looking at your page with Firebug, I see something else is messed up. If you add some height to:

<div class="content">
...

</div>

You will be fine, and the image will be clickable.

Upvotes: 4

Related Questions