homepage Welcome to WebmasterWorld Guest from 54.234.147.84
register, free tools, login, search, subscribe, help, library, announcements, recent posts, open posts,
Subscribe to WebmasterWorld
Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / HTML
Forum Library, Charter, Moderators: incrediBILL

HTML Forum

    
Div link not working
judgedredd




msg:4486674
 5:11 am on Aug 21, 2012 (gmt 0)

This is my first post here and I wasn't sure whether this was a css or html problem.

Doctype=
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">


I have placed a div a:link directly over another div image placement element that is also the surround for a video link (embedded youtube video).

I used a transparent png image as something for the link to 'wrap around' as nothing is else needed (text on the image).

But the link does not work even though I have put the z-index at 99 and the image div z-index at 1.

Here is the css code (the video-page div sits directly over the video div even though the numbers are not the same):
#video {
z-index:1;
position: relative;
float: left;
left: 420px;
top: -560px;
padding-left: 24px;
padding-top: 19px;
text-align: left;
}

#video-page {
z-index:99;
position: relative;
float: left;
border-width: 1px;
border-style: solid;
border: 1px solid #000000;
left: 196px;
top: -419px;
}


Here is the relevant html code:

<div id="video" style="background-image: url('images/polaroid-outer.png'); background-repeat: no-repeat; width:207px; height:186px;">
<iframe width="158" height="119" src="video-link.php=0" frameborder="0" allowfullscreen></iframe>
</div>

<div id="video-page" style="z-index:99; width:189px; height:34px;>
<a href="videos.php"><img src="images/link.png" width="182" height="34" border="0"></a>
</div>


Can someone let me know why the div link in video-page is not working?

Thanking everyone in advance for taking a look.

 

lucy24




msg:4486688
 6:57 am on Aug 21, 2012 (gmt 0)

You are soooo going to kick yourself. I did*, for not noticing it instantly-- even with the benefit of Syntax Highlighting in the text editor.
<div id="video-page" style="width:189px; height:34px;>
<a href="videos.php"><img src="images/link.png" width="182" height="34" border="0"></a>
</div>


Incidentally, the whole thing disappears for me when I include the "position: relative" lines. Different issue; I have to assume there's other stuff on the page.


* Not literally. The cat is sitting on me. But in the deeper, truer, more abstract sense I did.

birdbrain




msg:4486690
 7:17 am on Aug 21, 2012 (gmt 0)

oooops, did not notice that lucy24 had already spotted the initial error. :(


birdbrain

judgedredd




msg:4486718
 11:08 am on Aug 21, 2012 (gmt 0)

Oh dear!

You have no idea how many hours I looked at this code and couldn't see the error.

Thanks for the help lucy24 and for looking. Thanks to you too birdbrain.

birdbrain




msg:4486853
 3:18 pm on Aug 21, 2012 (gmt 0)

Hi there judgedredd,

"You have no idea how many hours I looked at this code and couldn't see the error."


Sometimes you just can't see the wood for the trees. :)

birdbrain

judgedredd




msg:4486855
 3:21 pm on Aug 21, 2012 (gmt 0)

Indeed!

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / HTML
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved