asked on

navigation gone wild

My programmer is struggling to figure out how to get the navigation to appear when he adds the carousel animation. For some reason, it goes missing.

Missing navigation with animation
http://nsitedesigns.com/nsitedesigns/miller/index_missingnav.html

Navigation working when placeholder displayed as an image and not navigation
http://nsitedesigns.com/nsitedesigns/miller/index_backupNav.html

Help!

ASKER CERTIFIED SOLUTION

SSupreme

membership

Create a free account to see this answer

Signing up is free and takes 30 seconds. No credit card required.

See answer

SOLUTION

dr_Pitter

membership

Create a free account to see this answer

Signing up is free and takes 30 seconds. No credit card required.

See answer

SSupreme

Actually, your main-nav is 0px height, if you add overflow:hidden; to your CSS it will get height of content inside.

nsitedesigns

ASKER

where do you see the height set to 0px?

*ul#main-nav li ul li a {min-width:90px;}   /*needed to manage width of IE7 drop down buttons*/


ul#main-nav {
	margin:0px 0px 10px 170px;
	width:935px;
padding-top:70px;
height:80px;
	position:absolute;
}


ul#main-nav li {
	margin:0;
	padding:0;
	list-style:none;
	float:left;
	display:inline; /*needed for ie bug*/
}

ul#main-nav li a {
	text-decoration:none;
	display:block;
	color:#333; /*main button text color no activity*/
	padding:4px 15px 6px;
font-family: Arial, Helvetica, sans-serif;
	font-size:14px;
	text-align:center;
	border-right:1px solid #666;
	white-space:nowrap;
	
	}

ul#main-nav li a:hover, ul#main-nav	li a:focus {
	text-decoration:none;
background-color:#14174f;
color:#fff;
	}

	
	
ul#main-nav li ul {
	padding:0;
	margin:0;
	display:none;}

ul#main-nav li:hover ul {/*needed so mouseovers float over main image*/
	display:block;
position:absolute; 
}

ul#main-nav li ul li {float:none;}

ul#main-nav li ul li a { /*drop down menu buttons w/o mouseover*/
	font-size:14px;
text-decoration:none;
background-color:#fff;
color:#000;
margin:0;
height:20px;
text-align:left;
border:0 none;
}




/*THIRD LEVEL BUTTONS*/
ul#main-nav li ul ul {
	margin: -1em 0 0 10em;
}


ul#main-nav li.lastbutton a {
	border:none;
	padding-right:8px;}

Open in new window

nsitedesigns

ASKER

duh, was looking at an old test page. sorry

SSupreme

It's auto if not set, auto div height is 0px, if there is no content like text.
Add #main-nav {overflow:hidden;} to your css and you will be fine.

SSupreme

You won't find "height set to 0px", browser apply it automatically.

nsitedesigns

ASKER

i have asked my programmer to try all suggestions. no word yet if he has had any luck.

SSupreme