Code won't work

[rande]

I got this from the net.

Can anyone tell me why it isn't working?

 

 

<div id=”nav”>

<ul>

<li class=”first”><a href=”#”>Home</a></li>

<li><a href=”#”>About Me</a></li>

<li><a href=”#”>Portfolio</a>

<ul>

<li><a href=”#”>Web</a></li>

<li><a href=”#”>Print</a></li>

<li><a href=”#”>Photos</a></li>

</ul>

</li>

<li><a href=”#”>Contact Me</a></li>

</ul>

</div>

 

 

 

 

*{ margin:0px; padding: 0px; }

 

#nav {

font-family: arial, sans-serif;

position: relative;

width: 390px;

height:56px;

font-size:14px;

color:#999;

margin: 0px auto;

}

 

#nav ul {

list-style-type: none;

}

 

#nav ul li {

float: left;

position: relative;

}

 

#nav ul li a {

text-align: center;

border-right:1px solid #e9e9e9;

padding:20px;

display:block;

text-decoration:none;

color:#999;

}

 

#nav ul li ul {

display: none

}

 

#nav ul li:hover ul {

display: block;

position: absolute;

}

 

#nav ul li:hover ul li a {

display:block;

background:#12aeef;

color:#ffffff;

width: 110px;

text-align: center;

border-bottom: 1px solid #f2f2f2;

border-right: none;

}

 

#nav ul li:hover ul li a:hover {

background:#6dc7ec;

color:#fff;

[Archadian28]

Its probably not working because of the first statement you made . And what part of the code isn't working?

Edited July 30, 2011 by Archadian

[MetaCry]

Make *{ margin:0px; padding: 0px; } to * { margin:0px; padding: 0px; }

[Andrea]

Make *{ margin:0px; padding: 0px; } to * { margin:0px; padding: 0px; }

 

Both look the same to me - what am I missing?

 

Btw - when it's '0' - no unit of measure is required, zero is zero px as em as cm as % as whatever, so this:

 

 

* {margin: 0; padding: 0;} is all you need.

[Archadian28]

Try

* { margin 0 auto; padding: 0 0; }

[Andrea]

Try

* { margin 0 auto; padding: 0 0; }

 

The '*' is a universal selector and that code would apply the auto right/left margin to EVERYTHING - that's probably not very practical overall. Also, there's no need to have two zeros for the padding. If you have one value, it applies to all four sides. If there are two, the first will be for top/bottom, the second for right/left. Since both have the same value in your example, the second zero is redundant.

[rande]

I just can't get the drop down to work.

I've been struggling with these navbars for a while now.

I'm curious what everyone else is doing?

The spry bars are easy but haven't had luck manipulating them

the way I want. I want them to center and separated from each other.

I'm going to work on that today. I loaded a plug-in to help manipulate

spry bars I guess I'll go back to that, unless someone else has a better idea.

[falkencreative]

Your issue is this section of code:

 

<div id=”nav”>
<ul>
<li class=”first”><a href=”#”>Home</a></li>
<li><a href=”#”>About Me</a></li>
<li><a href=”#”>Portfolio</a>
<ul>
<li><a href=”#”>Web</a></li>
<li><a href=”#”>Print</a></li>
<li><a href=”#”>Photos</a></li>
</ul>
</li>
<li><a href=”#”>Contact Me</a></li>
</ul>
</div>

Specifically, the quotation marks are not the standard vertical quotation marks (") found on a normal keyboard but the slightly slanted (typographically correct) quotation marks (”). Most likely, you copied/pasted this code from a blog that automatically converts the vertical style quotes to the other style (Wordpress does this automatically), and didn't realize you needed to fix that. Replacing the quotation marks with the standard vertical style marks will fix your issue, and the dropdown will work normally. I just tested this, and it does work.

[rande]

thanks Ben that did it.

Now if I can manipulated it, I'll be good for now.

 

BTW, I used to live in Paradise. My brother owns the Red Lion Pizza Parlor

in Magalia.

Small world.

[falkencreative]

BTW, I used to live in Paradise. My brother owns the Red Lion Pizza Parlor

in Magalia.

Small world.

Huh, interesting. I grew up in Southern CA, but I moved up to Chico for college.