PDA

View Full Version : CSS firefox unordered list, linking problem



jynx
July 28th, 2008, 12:12 PM
the red border shows me that firefox is making the whole list item a link, however i can only click where the background image shows up. i directly linked the picture, but let me know if thats not allowed, ill just upload the pic..btw in IE the whole list item works as a link


#nav {
float: left;
width: 100%;
margin: 0;
padding: 0;
list-style: none;
background: #CCC;
border-top: 1px solid #999;
border-bottom: 1px solid #999;
}

#nav h2{
float: right;
display: block;
padding: 6px 30px 6px 5px;
margin: 0 auto;
text-decoration: none;
font-weight: bold;
font-size: 90%;
color: #333;
}

#nav li {
float: left;
position: relative;

}

#nav li a {
float: left;
padding: 6px 30px 6px 5px;
text-decoration: none;
font-weight: bold;
font-size: 90%;
border: solid;
border-color: red;
color: #333;
background: #CCC url("http://summitpcg.com/images/nav_slant.gif") no-repeat top right;
}

#nav #nav-1 a {
padding-left: 20px;/*20*/
}

#nav a:hover {
color: #000;
}

ul#nav ul li {
list-style: none;
text-align: left;
}
/* Fix IE. Hide from IE Mac \*/
* html ul li { float: left; }
* html ul li a { height: 1%; }
/* End */

ul#nav ul li a {
min-width: 100px;
text-decoration: none;
color: #777;
/*background: #fff url(/SPCG/grad.gif) top repeat-x 20px;*/
background: #FFF;
padding: 5px;
border: 1px solid #ccc;
}

ul#nav li ul {
position: absolute;
display: none;
list-style: none;
width: 100%;
}

ul#nav li:hover > ul {
display: block;
left: -60px;
padding-top: 28px;
}

/* first menu spacing to compensate for left:-60 alignment */
.firstMenu{left: 10px;}



<!-- START nav -->

<div>
<ul id="nav">
<li id="nav-1"><a href="/aboutus.php">ABOUT US</a>
<ul>
<li class="firstMenu"><a href="/founder.php">Founder's Message</a></li>
<li class="firstMenu"><a href="/approach.php">Our Approach</a></li>
</ul>

</li>
<li><a href="/capital.php">CAPITAL</a>
<ul>
<li><a href="/mission.php">Our Mission</a></li>
<li><a href="/advantage.php">The SPCG Advantage</a></li>
</ul>
</li>

<li><a href="/capabilities.php">CAPABILITIES</a>
<ul>
<li><a href="/tools.php">The Right Tools</a></li>
</ul>
</li>

<li><a href="/focus.php">FOCUS</a>
<ul>
<li><a href="/investors.php">Investors</a></li>
<li><a href="/privfinancing.php">Private Financing</a></li>
<li><a href="/corpfinancing.php">Corporate Financing</a></li>
<li><a href="/busrevitilazation.php">Business Revitalization</a></li>
</ul>
</li>

<li><a href="/resources.php">RESOURCES</a>
<ul>
<li><a href="/executivepartners.php">Executive Partners</a></li>
<li><a href="/specialsituation.php">Special Opportunities</a></li>
<li><a href="/glossary.php">Glossary</a></li>
</ul>
</li>

<li><a href="/contact.php">CONTACT</a>
</li>

<h2>CAPITAL | REDEFINED.</h2>

</ul>



</div>



<!-- END nav -->

simplistik
July 28th, 2008, 12:59 PM
Would probably need to see the actual html page, but I can tell you right now that your

<h2>CAPITAL | REDEFINED.</h2> can not just reside in the <ul> like that, it needs to be enclosed in a <li>

I don't think that's the problem, but it is a problem nonetheless

jynx
July 28th, 2008, 01:12 PM
hxxp://summitpcg.com/founder.php

ok i will fix that. its really strange i just noticed that in firefox the mouse changes to a hand for a split second when im over the base menu, and then goes away. and i also noticed that the link for 'CONTACT' works perfect, however it is the only link that does not have a drop down menu. im sure it has something to do with this.