Navigation Menu Dissapears

**TomTom100** · 08-07-2011 01:49 PM

I posted a thread here http://www.webdeveloper.com/forum/sh...73#post1167073 about my navigation menu having an unwanted margin and got that fixed and now I have another problem. I have changed all my measurements from percentages to pixels. Unfortunately this has caused a new problem: my menu has just disappeared! How can I fix this?

Code:

@charset "utf-8";
/* CSS Document */

html, body {
	height:100%;
	overflow:hidden;
}

* {
	margin:0;
	padding:0;
}

#content {
	background-color:#ffffff;
	width:1000px;
	height:500px;
	margin-left:auto;
	margin-right:auto;
	margin-top:-10px;
	border:60px solid #000000;
}

#left {
	width:250px;
	float:left;
	border-right:1px dotted #333;
	padding-left:10px;
	padding-right:10px;
	height:500px;
}

#right {
	width:750px;
	float:right;
	padding-left:10px;
	padding-right:10px;
	height:500px;
	font-family:Georgia, "Times New Roman", Times, serif;
}

#filler {
	background-color:#000;
	height:10000px;
	margin-left:auto;
	margin-right:auto;
	width:1000px;
	border:60px solid #000000;
}

h1 {
	font-family:Georgia, "Times New Roman", Times, serif;
	color:#0B0B0B;
	margin-top:20px;
}

p {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:12px;
	margin-top:20px;
	margin-left:4px;
	margin-right:20px;
	margin-bottom:30px;
}

a {
	color:#333;
	text-decoration:none;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:12px;
}

a:hover {
	color:#CCC;
	text-decoration:underline;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:12px;
}

a:active {
	text-decoration:underline;
	color:#000;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:12px;
}



/*********************************NAVIGATION****************************************/


.navMenu {
	margin:100px 0 0;
	padding:0;
}

.navMenu ul {
	margin:0;
	padding:0;
	line-height:10px;
}

.navMenu li {
	padding:0;
	list-style:none;
	float:left;
	position:relative;
	background-color:#FF0000;
	margin-right:5px;
	border-bottom-left-radius:10px;
	border-bottom-right-radius:10px;
}

.navMenu ul li a {
	text-align:center;
	font-family:Tahoma, Geneva, sans-serif;
	font-size:9px;
	font-weight:bold;
	text-decoration:none;
	width:60px;
	height:10px;
	display:block;
	color:#FFFFFF;
}

.navMenu a:hover {
	top:0px;
	color:#FFFFFF;
	text-decoration:none;
	background-color:#AA0000;
	border-bottom-left-radius:10px;
	border-bottom-right-radius:10px;
}

.clearFloat {
	clear:both;
	margin:0;
	padding:0;
}

HTML Code:

<body bgcolor="#d5d5d5">

	<!--<div id="wrap">-->

	<div id="content">
    	
        <div id="left"> <a href="http://www.theregencyguesthouse.co.uk"><img src="../images/logo.png" alt="The Regency Guset House" width="316" height="61" border="0" align="absmiddle" style="margin-top:80%; margin-left:-10%;" /></a>
    </div><!--END LEFT-->
	<!-- TemplateBeginEditable name="content" -->
        
        <div id="right">
   	      <!-- Begin DWUser_EasyRotator -->
                <script type="text/javascript" src="http://c520866.r66.cf2.rackcdn.com/1/js/easy_rotator.min.js"></script>
                <div class="dwuserEasyRotator" style="width: 100%; height: 100%; position:relative; text-align: left;" data-erconfig="{autoplayEnabled:true, lpp:'102-105-108-101-58-47-47-47-67-58-47-85-115-101-114-115-47-84-104-111-109-97-115-47-68-111-99-117-109-101-110-116-115-47-69-97-115-121-82-111-116-97-116-111-114-80-114-101-118-105-101-119-47-112-114-101-118-105-101-119-95-115-119-102-115-47'}" data-ername="regencyguesthouse">
                  <div data-ertype="content" style="display: none;">
                    <ul data-erlabel="Main Category">
                      <li> <img class="main" src="images/DSC_0484.JPG" /> <img class="thumb" src="images/DSC_0484.JPG" /> </li>
                      <li> <img class="main" src="images/DSC_0473.JPG" /> <img class="thumb" src="images/DSC_0473.JPG" /> </li>
                      <li> <img class="main" src="images/DSC_0421.JPG" /> <img class="thumb" src="images/DSC_0421.JPG" /> </li>
                      <li> <img class="main" src="images/DSC_0419.JPG" /> <img class="thumb" src="images/DSC_0419.JPG" /> </li>
                    </ul>
                  </div>
                  <div data-ertype="layout" data-ertemplatename="NONE" style="">
                    <div class="erimgMain" style="position: position; left:0;right:0;top:0;bottom:0;" data-erconfig="{__numTiles:3, scaleMode:'scaleUpAndDown', imgType:'main', __loopNextButton:false, __arrowButtonMode:'rollover'}">
                      <div class="erimgMain_slides" style="position: absolute; left:0; top:0; bottom:0; right:0;">
                        <div class="erimgMain_slide">
                          <div class="erimgMain_img" style="position: absolute; left: 0; right: 0; top: 0; bottom: 0;"></div>
                        </div>
                      </div>
                      <div class="erimgMain_arrowLeft" style="position:absolute; left: 10px; top: 50%; margin-top: -15px;" data-erconfig="{image:'circleSmall', image2:'circleSmall'}"></div>
                      <div class="erimgMain_arrowRight" style="position:absolute; right: 10px; top: 50%; margin-top: -15px;" data-erconfig="{image:'circleSmall', image2:'circleSmall'}"></div>
                    </div>
                    <div class="erabout erFixCSS3" style="color: #FFF; text-align: left; background: #000; background:rgba(0,0,0,0.93); border: 2px solid #FFF; padding: 20px; font: normal 11px/14px Verdana,_sans; width: 300px; border-radius: 10px; display:none;"> This <a style="color:#FFF;" href="http://www.dwuser.com/easyrotator/" target="_blank">jQuery slider</a> was created with the free <a style="color:#FFF;" href="http://www.dwuser.com/easyrotator/" target="_blank">EasyRotator</a> software from DWUser.com. <br />
                      <br />
                      Need a powerful <a style="color:#FFF;" href="http://www.dwuser.com/flashslideshow/" target="_blank">Flash slideshow</a> creator with built-in iPhone/iPad/Android support?  EasyRotator is supported by the <a style="color:#FFF;" href="http://www.dwuser.com/flashslideshow/" target="_blank">XML Flash Slideshow v4 Software</a>. <br />
                      <br />
                      <a style="color:#FFF;" href="#" class="erabout_ok">OK</a> </div>
                    <noscript>
                      Powered by <a href="http://www.dwuser.com/easyrotator/">EasyRotator</a>, a free and easy <a href="http://www.dwuser.com/easyrotator/">jQuery slider</a> builder from DWUser.com.
                    </noscript>
                  </div>
                </div>
                <!-- End DWUser_EasyRotator -->
      </div><!--END RIGHT-->
        <!-- TemplateEndEditable -->
        <br class="clearFloat" />
    
    
    <div id="nav">
    
    <div class="navMenu">
		<ul>
			<li><a href="../index.html">Home</a>
				<ul>
					<li></li>
					<li></li>
				</ul>
			</li>
		</ul>
	</div>


	<div class="navMenu">
		<ul>
			<li><a href="../rooms.html">Rooms</a>
				<ul>
					<li></li>
					<li></li>
				</ul>
			</li>
		</ul>
	</div>


	<div class="navMenu">
		<ul>
			<li><a href="../policies.html">Policies</a>
				<ul>
					<li></li>
					<li></li>
				</ul>
			</li>
		</ul>
	</div>

	<div class="navMenu">
		<ul>
			<li><a href="../food.html">Food</a>
				<ul>
					<li></li>
					<li></li>
				</ul>
			</li>
		</ul>
	</div>
    
    
    <div class="navMenu">
		<ul>
			<li><a href="../directions.html">Directions</a>
				<ul>
					<li></li>
					<li></li>
				</ul>
			</li>
		</ul>
	</div>


	<div class="navMenu">
		<ul>
			<li><a href="../contact.html">Contact</a>
				<ul>
					<li></li>
					<li></li>
				</ul>
			</li>
		</ul>
	</div>
    
    <div class="navMenu">
		<ul>
			<li>
				<ul>
					<li></li>
					<li></li>
				</ul>
			</li>
		</ul>
	</div>
   <br class="clearFloat" />
</div><!--END NAV-->


</div><!--END CONTENT-->

<div id="filler">
</div><!--END FILLER-->


<!--</div><!--END WRAP-->

</body>

Thanks
Thomas

Thread: Navigation Menu Dissapears

Thread Tools

Display

Hybrid View

Navigation Menu Dissapears

Thread Information

Users Browsing this Thread

Tags for this Thread

Bookmarks

Bookmarks

Posting Permissions