homepage Welcome to WebmasterWorld Guest from 50.17.162.174
register, free tools, login, search, subscribe, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: DrDoc

CSS Forum

    
links in inline list. hotspots only registering on outer-most links
set of 5 links... 3 in the middle are not registering as links
Don_Hoagie




msg:3203219
 8:53 pm on Dec 29, 2006 (gmt 0)

Seems like the more i learn, the stupider i get...

I've got an inline ul with 5 links in it... the li's are margined out at 3% for the right side, and otherwise, everything is zeroed out. What i can't figure out is why this code renders the inside 3 links unclickable. I set background colors to check out the scene and everything seems fine... i removed the margin and still, only the outer areas of the list are hot-spotted. Seems to be that the hot spots for links here have unravelled from the text they're supposed to match up with. Doesn't seem to jive with this super-simple code... any help would be great.

#nav {z-index: 89; position: absolute; top: 144px; left: 0; height: 26px; width: 97%; padding: 17px 0 0 3%; text-align: center;}
#nav ul{padding: 0; margin: 0; display: inline;}
#nav li{list-style: none; display: inline; padding: 0; margin: 0 3% 0 0}
#nav li a{color: #c00;}

<div id="nav">
<ul>
<li><a href="12">Test Link</a></li>
<li><a href="34">Test Link</a></li>
<li><a href="56">Test Link</a></li>
<li><a href="78">Test Link</a></li>
<li><a href="90">Test Link</a></li>
</ul>
</div>

 

cmarshall




msg:3203821
 5:53 pm on Dec 30, 2006 (gmt 0)

These all work fine for me when I slap them into a test file (below).

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<style type="text/css">
/* <![CDATA[ */
#nav {z-index: 89; position: absolute; top: 144px; left: 0; height: 26px; width: 97%; padding: 17px 0 0 3%; text-align: center;}
#nav ul{padding: 0; margin: 0; display: inline;}
#nav li{list-style: none; display: inline; padding: 0; margin: 0 3% 0 0}
#nav li a{color: #c00;}
/* ]]> */
</style>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Untitled</title>
</head>
<body>
<div id="nav">
<ul>
<li><a href="12">Test Link</a></li>
<li><a href="34">Test Link</a></li>
<li><a href="56">Test Link</a></li>
<li><a href="78">Test Link</a></li>
<li><a href="90">Test Link</a></li>
</ul>
</div>
</body>
</html>

londrum




msg:3203958
 9:07 pm on Dec 30, 2006 (gmt 0)

...maybe you've just got another block overlapping it.
try changing the z:index to bring it right to the front and see if that works. or colour all of the other blocks around it to see which one is overlapping.

Don_Hoagie




msg:3205752
 2:32 pm on Jan 2, 2007 (gmt 0)

>> ...maybe you've just got another block overlapping it.
try changing the z:index to bring it right to the front and see if that works. or colour all of the other blocks around it to see which one is overlapping.


Ugh.

Thanks. That did it. I don't usually use abs-pos, so it's also rare that I use z-index... but, more accurately, I'm just an idiot. At any rate, thanks both for your help!

Global Options:
 top home search open messages active posts  
 

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

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About
© Webmaster World 1996-2014 all rights reserved