CSS Help
 
Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
User Name:
Password:
Remember me

The Shed is going Social! Join us on FaceBook and Twitter and chime in on the conversation.

Go Back   Dev Shed ForumsWeb DesignCSS Help

Reply
Add This Thread To:
  Del.icio.us   Digg   Google   Spurl   Blink   Furl   Simpy   Y! MyWeb 
Thread Tools Search this Thread Rate Thread Display Modes
 
Unread Dev Shed Forums Sponsor:
  #1  
Old September 6th, 2012, 11:42 PM
AmpWeb AmpWeb is offline
Registered User
Dev Shed Newbie (0 - 499 posts)
 
Join Date: Sep 2012
Posts: 6 AmpWeb User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 59 m 18 sec
Reputation Power: 0
Exclamation Content scrolling over/on top of static top nav

So, my previous post got deleted, which was kinda sucky since I am legitimately asking for help and my deadline is tomorrow.

ampersand web studio dot com slash dev slash officepal slash homepage dot html

The button and some of the content is scrolling OVER the fixed position nav rather than under it. I am including the code this time, but to really understand what I am talking about you have to see it. Either download the code and make it work or go to the website it doesn't matter but PLEASE don't delete my post! I don't know where else to go!

Code:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Officepal Homepage</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div class="navigation">
  <div class="navmodule">
		<div class="logo"></div><!---logo closed--->
		<div class="navmenu">
        	<img src="images/user.png" width="30" height="30" border="0" /><span class="username">Jenny Jones</span>
            <img src="images/nav-divider.png" width="2" height="29" border="0" />
	  		<img src="images/notificationpositive.png" width="30" height="30" class="notify" border="0" /><span class="new">13</span>
            <img src="images/nav-divider.png" width="2" height="29" border="0" />
            <img src="images/home-active.png" width="30" height="30" border="0" />
            <img src="images/nav-divider.png" width="2" height="29" border="0" />
            <img src="images/settings-inactive.png" width="30" height="30" border="0"/>
        </div><!---navmenu closed--->
  		<img src="images/carrot.png" width="60" height="12" class="activehome"/>
  </div><!---navmodule closed--->
</div><!---navigation closed--->

<div class="clear"></div>

<div class="askbox">
  <div style="float:left;">
	<input type="text" name="s" id="ask" class="ask" value=" Ask officepals..." />
  </div>
  <span class="from">from</span> 
  <div id="locationcssmenu">
	<ul id="location" class="topmenu">
		<li class="toplast"><a href="#">San Francisco Bay Area<img src="images/dropdown.png" width="12" height="10"border="0"></a>
		<ul>
			<li><a href="#"><img src="images/searchicon.png" width="17" height="14" border="0"> Search for your location</a></li>
			<li><a href="#">Seattle Area</a></li>
			<li><a href="#">Chicago Area</a></li>
			<li><a href="#">New York City Area</a></li>
		</ul></li>
	</ul>
  </div>
</div><!---askbox closed--->

<div class="contentbox">
	<div class="header">Recent Questions</div>
	<div class="menu1home">San Francisco Bay Area <img src="images/menudown.png" width="9" height="8" border="0"/></div>
	<div class="menu2home"><a href="#.html">My Company (10)</a></div>
	<div class="menu3home"><a href="#.html">My Network (20)</a></div>
	<div class="menu4home"><a href="#.html">All Over The World (100)</a></div>

<div class="clear"></div>

<div class="questionboxcontent"> 
	<img src="images/userimage.png" width="50" height="50" class="image-level1" border="0"/>
	<div class="text-level1">
		<p class="questiontitle">Looking for an Italian restsurant for a customer dinner.</p>
		<p class="questionbody">Anyone have any suggestions for an upscale Italian restaurant in the Santa Clara area? Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis et quam eget diam ullamcorper eget et ullamcorper id id orci. Don...<a href="#.html">more»</a></p>
		<div id="info"><span class="author">by <a href="#.html">Kelly Cartwright</a> 10 minutes ago </span></div>

      <div id="info"><ul id="editmenu" class="topmenu">
			<li class="toplast"><a href="#"><img src="images/edit-icon.png" class="hidden-edit" width="13" height="16" border="0" /></a>
				<ul>
					<li><a href="#">Edit this post</a></li>
					<li><a href="#">Delete this post</a></li>
					<li><a href="#">Flag this Post</a></li>
				</ul>
			</li>
		</ul></div>
        <div id="info" class="spacer"><img src="images/replyicon.png" width="46" height="13" class="hidden-reply" border="0" /></div>
      <div class="clear"></div>
        <div class="answertextboxbackground"><input name="" id="answertextbox" class="answertextbox" value="Be the first to answer..." type="text" /></div>
      </div>
	<div class="clear"></div>
</div>

<div class="clear"></div>

<div class="questionboxcontent"> 
	<img src="images/userimage.png" width="50" height="50" class="image-level1" border="0" />
	<div class="text-level1">
		<p class="questiontitle">Looking for an Italian restsurant for a customer dinner.</p>
		<p class="questionbody">Anyone have any suggestions for an upscale Italian restaurant in the Santa Clara area? Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis et quam eget diam ullamcorper eget et ullamcorper id id orci. Don...<a href="#.html">more»</a></p>
		<div id="info"><span class="author">by <a href="#.html">Kelly Cartwright</a> 10 minutes ago </span></div>

      <div id="info"><ul id="editmenu" class="topmenu">
			<li class="toplast"><a href="#"><img src="images/edit-icon.png" class="hidden-edit" width="13" height="16"  /></a>
				<ul>
					<li><a href="#">Edit this post</a></li>
					<li><a href="#">Delete this post</a></li>
					<li><a href="#">Flag this Post</a></li>
				</ul>
			</li>
		</ul></div>
      <div id="info" class="spacer"><img src="images/replyicon.png" width="46" height="13" class="hidden-reply" border="0" /></div>
      <div class="clear"></div>
      <div class="numberanswers"><a href="#.html">2 Answers <img src="images/down.png" width="7" height="7" border="0" /></a></div>
      <div class="clear"></div>
        <div class="answertextboxbackground"><input name="" id="answertextbox" class="answertextbox" value="Answer the question..." type="text" /></div>
    </div>
	<div class="clear"></div>
</div>

<div class="clear"></div>

<div class="questionboxcontent"> 
	<img src="images/userimage.png" width="50" height="50" class="image-level1" border="0" />   
	<div class="text-level1">
		<p class="questiontitle">Looking for an Italian restsurant for a customer dinner.</p>
		<p class="questionbody">Anyone have any suggestions for an upscale Italian restaurant in the Santa Clara area? Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis et quam eget diam ullamcorper eget et ullamcorper id id orci. Don...<a href="#.html">more»</a></p>
		<div id="info"><span class="author">by <a href="#.html">Kelly Cartwright</a> 10 minutes ago </span></div><!--- info closed--->
		<div id="info">
          	<ul id="editmenu" class="topmenu">
          		<li class="toplast"><a href="#"><img src="images/edit-icon.png" class="hidden-edit" width="13" height="16" border="0" /></a>
					<ul>
						<li><a href="#">Edit this post</a></li>
						<li><a href="#">Delete this post</a></li>
						<li><a href="#">Flag this Post</a></li>
					</ul>
				</li>
          	</ul>
		</div><!---info closed--->
		<div id="info" class="spacer"><img src="images/replyicon.png" width="46" height="13" class="hidden-reply" border="0" /></div><!---info closed--->
		<div class="clear"></div>
		<div class="numberanswers"><a href="#.html">Hide Answers <img src="images/arrowup.png" width="7" height="7" border="0" /></a></div>
	</div><!---text-level1 closed--->

	<div class="clear"></div>

	<div class="answerboxcontent"> 
		<img src="images/userimage.png" width="35" height="35" class="image-level2" border="0"/>
		<div class="text-level2">
			<p class="answerbody">Anyone have any suggestions for an upscale Italian restaurant in the Santa Clara area? Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis et quam eget diam ullamcorper eget et ullamcorper id id orci. Don quam eget quam eget quam eget diam ullamcorper eget diam ullamcorper egetdiam ullamcorpdus...<a href="#.html">more»</a></p>
			<div id="info"><span class="author">by <a href="#.html">Kelly Cartwright</a> 10 minutes ago </span></div>
			<div id="info">
            	<ul id="editmenu" class="topmenu">
					<li class="toplast"><a href="#"><img src="images/edit-icon.png" class="hidden-edit" width="13" height="16" border="0" ></a>
						<ul>
							<li><a href="#">Edit this post</a></li>
							<li><a href="#">Delete this post</a></li>
							<li><a href="#">Flag this Post</a></li>
						</ul>
					</li>
				</ul>
			</div>
			<div id="info" class="spacer"><img src="images/replyicon.png" width="46" height="13" class="hidden-reply" border="0" /></div>
			<div class="clear"></div>
			<div class="numbercomments"><a href="#.html">Hide Comments <img src="images/arrowup.png" width="7" height="7" border="0" /></a></div>
			<div class="clear"></div>
			<div class="answertextboxbackground"><input name="" id="commenttextbox" class="answertextbox" value="Comment on the answer.." type="text" /></div>
		</div><!--- text-level2 closed--->
        
        <div class="clear"></div>
       
      	<div class="commentboxcontent"> 
			<img src="images/userimage.png" width="35" height="35" class="image-level3" border="0" />
			<div class="text-level3">
				<p class="commentbody">Anyone have any suggestions for an upscale Italian restaurant in the Santa Clara area? Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis et quam eget diam ullamcorper quam eget diam ullamcorper eget quam eget diam ullamcorper eget quam eget et ullamcorper id id or...<a href="#.html">more»</a></p>
				<div id="info"><span class="author">by <a href="#.html">Kelly Cartwright</a> 10 minutes ago </span></div>
				<div id="info">
					<ul id="editmenu" class="topmenu">
						<li class="toplast"><a href="#"><img src="images/edit-icon.png" class="hidden-edit" width="13" height="16" border="0" /></a>
							<ul>
								<li><a href="#">Edit this post</a></li>
								<li><a href="#">Delete this post</a></li>
								<li><a href="#">Flag this Post</a></li>
							</ul>
						</li>
					</ul>
				</div>
				<div id="info" class="spacer"><img src="images/replyicon.png" width="46" height="13" class="hidden-reply" border="0" /></div>
			</div><!--- text-level3 closed--->
			<div class="clear"></div>
		</div><!--- commentboxcontent closed --->
    </div><!--- answerboxcontent closed--->
 
	<div class="text-level1">
		<div class="answertextboxbackground"><input name="" id="answertextbox" class="answertextbox" value="Answer the question..." type="text" /></div>
	</div>
	<div class="clear"></div>
</div><!---questionboxcontent closed--->

	<p align="center">More</p>	
</div><!---contenbox xlosed--->

<div class="clear"></div>


</body>
</html>


Code:
@charset "UTF-8";
/* CSS Document */

/*    ................................................................................GLOBAL SETTINGS   */
/*    ................................................................................Page Properties    */

body{
	font-family:Arial, Helvetica, sans-serif;
	background-image:url(images/bg.png);
	background-repeat:repeat;
	margin:0px;}
.clear{
	clear:both;}
a {
	color:#3366cc;
	text-decoration:none;}


/*    ................................................................................Navigation Properties   */
.navigation{/* navigation pane */
	background-image:url(images/nav-bg.png);
	background-repeat:repeat;
	height:60px;
	width:100%;
    position:fixed;}
.navmodule{/* content box for navigation */
	width:836px;
	margin-left:auto;
	margin-right:auto;}
.logo{/* logo div */
	background-image:url(images/logo.png);
	width:163px;
	height:60px;
	float:left;}
.navmenu{/* container for navigation buttons */
	float:right;
	margin-top:15px;}
.navmenu img{/* spacing for nav images */
	margin-left:15px;}
.new{/* notification text */
	color:#FFF;
	font-size:11px;
	font-weight:bold;
	position:relative;
	top:-18px;
	margin-right:0px;}
.notify{/*correcting margins of notification icon*/
	margin-right:-15px;}
.username{/*users name*/
	color:#333;
	font-size:16pt;
	margin-left:5px;
	vertical-align:inherit;
	vertical-align:super;
	padding-top:10px;
	text-shadow: 2px 2px 2px #615d61;
    filter: dropshadow(color=#615d61, offx=2, offy=2);}

/*     ................................................................................PAGE PROPERTIES     */
/*     ................................................................................Homepage Properties     */
.activehome{/*carrot for the homepage*/
	margin-top:3px;
	margin-left:558px;}

/*     ................................................................................askbox properties */
.askbox{/*container for the ask section */
	border-radius: 5px; 
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px; 
	border: 1px solid #BBBBBB;
	background-color:#e6e4e2;
	width:796px;
	height:45px;
	margin-left:auto;
	margin-right:auto;
	margin-top:20px;
	padding:20px;}
#ask{
 	border-radius: 5px;
  	-moz-border-radius: 5px;
	-webkit-border-radius: 5px; 
    border:solid 1px #c1bfbe;
    padding:5px;/*ask textbox */
	height:33px;
	width:450px;
	float:left;}
#ask:focus { /*blue outline and text changes when clicked*/
	border: 2px solid #8ea3df; 
	outline:none;
	float:left;
	margin-right:-2px;
	font-size:12px;
	color:#333;}
.ask{/*default textbox text style */
	font-size:20px;
	color:#acb0bd;
	padding-left:10px;}
.from{/*from text style*/
	font-size:20px;
	color:#333;
	line-height:50px;
	margin-right:10px;
	margin-left:15px;
	float:left;}
/*     ................................................................................location properties */
.locationcssmenu{
	float:right;}
/* Top level UL */
ul#location{
	position:relative;
	display:inline-block;
	*display:inline;}
ul#location,ul#location ul{
	margin:0;
	padding:0;
	background-color:#dedede;
	border-width:1px;
	border-style:solid;
	border-color:#c4c6cd;
	list-style:none;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;}
ul#location img{
	border:none;
	vertical-align:middle;
	margin-left:10px;}
ul#location span{
	display:block;
	overflow:visible;
	padding-right:0px;}
ul#location a{
	display:block;
	vertical-align:middle;
	text-align:left;
	text-decoration:none;
	font:20px Arial,Helvetica,sans-serif;
	color:#333;
	padding:10px;
	width:240px;
	background-image:url(images/button-bg.png);
	background-repeat:repeat;
	background-position:0 0;
	border-width:0px;
	border-style:solid;
	border-color:#C0C0C0;}
/* Top Level LI */
ul#location li{
	position:relative;
	display:block;
	white-space:nowrap;
	float:left;}
* html ul#location li a{
	display:inline-block;}
ul#location li:hover>*{
	display:block;}
ul#location li:hover{
	z-index:1;}
ul#location li:hover>a,ul#location li a.pressed{
	background-color:#dddbd9;
	border-color:#C0C0C0;
	border-style:solid;
	color:#333333;
	text-shadow:#FFF 0 0 1px;
	background-image:url("mainbk.png");
	text-decoration:none;}
ul#location li.toplast>a{
	border-radius:0 5px 5px 0;
	-moz-border-radius:0 5px 5px 0;
	-webkit-border-radius:0;
	-webkit-border-top-right-radius:5px;
	-webkit-border-bottom-right-radius:5px;}
/* Drop down UL */	
ul#location ul{
	display:none;
	position:absolute;
	width:260px;
	background-color:#FFFFFF;
	border: 1px solid #c4c6cd;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;}
ul#location ul a{
	text-align:left;
	padding:4px;
	background-image:none;
	padding-left:10px;
	font:14px Arial,Helvetica,sans-serifa;
	line-height:21px;
	color:#666;
	text-decoration:none;}
/* Drop Down LI */
ul#location ul li{
	float:none;
	margin:0px;
	border-bottom:1px solid #dddddd;}
ul#location ul li:hover>a,ul#location ul li a.pressed{
	background-color:#f4f4f4;
	background-image:none;
	width:245px;
	color:#666;
	text-decoration:none;}
/*     ................................................................................content properties*/
.contentbox{/*content container*/
	border-radius: 5px; 
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px; 
	border: 1px solid #BBBBBB;
	background-color:#FFF;
	width:836px;
	margin-left:auto;
	margin-right:auto;
	margin-top:20px;
	margin-bottom:30px;}
.header{
	margin-top:20px;
	margin-left:20px;
	font-size:24px;
	color:#333;
	font-weight:bold;
	margin-bottom:20px;}
	
/*     ................................................................................menu styles*/
.menu1home{
	width:233px;
	height:30px;
	padding-top:10px;
	text-align:center;
	background-color:#e6e4e2;
	border-top: 1px solid #acb0bd;
	border-bottom: 1px solid #acb0bd;
	border-right: 1px solid #acb0bd;
	float: left;}
.menu2home{
	width:185px;
	height:30px;
	padding-top:10px;
	text-align:center;
	border-top: 1px solid #c3c5cc;
	border-bottom: 1px solid #c3c5cc;
	border-right: 1px solid #c3c5cc;
	background-color:#e6e4e2;
	float:left;}
.menu3home{
	width:185px;
	height:30px;
	padding-top:10px;
	text-align:center;
	border-top: 1px solid #c3c5cc;
	border-bottom: 1px solid #c3c5cc;
	border-right: 1px solid #c3c5cc;
	background-color:#e6e4e2;
	float:left;}
.menu4home{
	width:230px;
	height:30px;
	padding-top:10px;
	text-align:center;
	border-top: 1px solid #c3c5cc;
	border-bottom: 1px solid #c3c5cc;
	background-color:#e6e4e2;
	float:left;}
.menulink{
	text-align:center;}
		
/*     ................................................................................question box styles*/
.questionboxcontent{/*question container*/
	background-color:#fff;
	border-bottom:1px solid #e5e8f0;}
.questionboxcontent:hover{/*background color change*/
	background-color:#f4f4f4;}
.questionboxcontent:hover a{/*link color change*/
	color:#3366cc;}
.image-level1{/*user image*/
	margin-left:20px;
	margin-top:20px;
	width:50px;
	height:50px;
	float:left;}
.text-level1{/*text container*/
	margin-right:20px;
	width:731px;
	float:right;}
.questiontitle{/*question title style*/
	font-size:16px;
	font-weight:bold;
	margin-top:20px;
	margin-bottom:0px;}
.questionbody{/*question body style*/
	margin-top:5px;
	margin-bottom:0px;
	font-size:14px;
	color:#666;}
.questionbody a{/*link style for body*/
	text-decoration:none;
	color:#999999;
	font-weight:bold;}
.questionbody a:hover{/*hover link change*/
	color:#3366cc;}
.author{/*question author style*/
	margin-top:5px;
	font-size:12px;
	color:#999;
	float:left;
	position:relative;}
.author a{/*author link style*/
	text-decoration:none;
	color:#999999;
	font-weight:bold;}
.answers{/*# of answers style*/
	font-size:12px;
	color:#333;}
.answers a{/*answers link style*/
	text-decoration:none;
	color:#333;
	font-weight:bold;}
#info{
	float:left;}
/*     ................................................................................edit menu styles*/
.hidden-edit {/*hidden edit icon*/
	display:none; 
	margin-left:10px;
	margin-top:-20px;}
ul#editmenu,ul#editmenu ul{
	margin-top:20px;
	list-style:none;
	padding:0;}
ul#editmenu ul{/* drop down menu */
	display:none;
	position:absolute;
	width:100px;
	margin-top:3px;
	background-color:#fff;
	margin-left:10px;
	border: 1px solid #999;
	padding:0 10px 10px;}
ul#editmenu li:hover>*{
	display:block;}
ul#editmenu li{
	display:block;
	float:left;}
ul#editmenu{
	position:relative;
	display:inline-block;}
ul#editmenu ul li{
	float:none;
	padding-top:5px;}
ul#editmenu ul a{
	text-align:left;
	font:12px Arial, Helvetica, sans-serif;
	line-height:14px;
	color:#999;
	text-decoration:none;}
.hidden-reply{
	display:none;
	float:left;
	position:relative;
	font-size:12px;
	margin-left:20px;}
.spacer{
	margin-left:10px;
	margin-top:8px;
	position:relative;}
/*     ................................................................................number of X styles*/	
.numberanswers{
	color:#333;
	font-size:12px;
	font-weight:bold;
	margin-top:-10px;
	margin-bottom:15px;
	position:relative;}
.numberanswers a{
	color:#333;}
.numbercomments{
	color:#333;
	font-size:12px;
	font-weight:bold;
	margin-top:-10px;
	margin-bottom:12px;
	position:relative;}
.numbercomments a{
		color:#333;}

/*     ................................................................................question box styles*/	
.questionboxcontent:hover .hidden-edit,  .questionboxcontent:hover .hidden-reply{/*show icon on hover*/
	display:block;
	position:absolute;}
/*   question text boxes   */	
.answertextboxbackground{/* answerbox softening background */
	border-radius: 5px; 
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px; 
	padding:10px;
	background-color:#f4f4f4;
	margin-bottom:20px;}
.questionboxcontent:hover .answertextboxbackground{/* mouseover background change */
	background-color:#ebebeb;}
#answertextbox{/* textbox */
	border-radius: 5px; 
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px; 
    border:solid 1px #c1bfbe;
    padding:5px;
	height:20px;
	width:695px;}
#answertextbox:focus { /* textbox blue and text change onclick */
	border: 2px solid #8ea3df; 
	outline:none;
	font-size:12px;
	color:#333;
	margin-top:-1px;
	margin-bottom:-1px;}
#commenttextbox{/* textbox */
	border-radius: 5px; 
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px; 
    border:solid 1px #c1bfbe;
    padding:5px;
	height:20px;
	width:645px;}
#commenttextbox:focus { /* textbox blue and text change onclick */
	border: 2px solid #8ea3df; 
	outline:none;
	font-size:12px;
	color:#333;
	margin-top:-1px;
	margin-bottom:-1px;}
.answertextbox{/* default textbox text style */
	font-size:14px;
	color:#acb0bd;
	padding-left:10px;}
/*     ................................................................................answer content properties*/
.answerboxcontainer{
	width:730px;
	float:right;}
.image-level2{/*user image*/
	width:35px;
	height:35px;
	margin-left:86px;
	margin-top:-3px;
	float:left;}
.text-level2{/*test container*/
	margin-top:-11px;
	width: 680px;
	float:right;
	margin-right:20px;}
.answerbody{/*question body style*/
	margin-top:5px;
	margin-bottom:0px;
	font-size:14px;
	color:#666;}
.answerbody a{/*link style for body*/
	text-decoration:none;
	color:#999999;
	font-weight:bold;}
.answerbody a:hover{/*hover link change*/
	color:#3366cc;}
/*     ................................................................................comment content properties*/
.commentboxcontainer{
	width:730px;
	float:right;}
.image-level3{/*user image*/
	width:35px;
	height:35px;
	margin-left:136px;
	float:left;
	margin-top:-5px;}
.text-level3{/*test container*/
	margin-top:-15px;
	margin-right:20px;
	width: 629px;
	float:right;}
.commentbody{/*question body style*/
	margin-top:5px;
	margin-bottom:0px;
	font-size:14px;
	color:#666;}
.commentbody a{/*link style for body*/
	text-decoration:none;
	color:#999999;
	font-weight:bold;}
.commentbody a:hover{/*hover link change*/
	color:#3366cc;}
	
/*     ................................................................................BROWSER HACKS     */
@media screen and (-webkit-min-device-pixel-ratio:0)
{
.hidden-edit {margin-top:-14px;}
}
@-moz-document url-prefix() {
	.hidden-edit{margin-top:-15px;}
}
@-moz-document url-prefix() {
	.numberanswers{position:relative;}
}
@-moz-document url-prefix() {
	.image-level2{margin-top:16px}
}
@-moz-document url-prefix() {
	.answertextboxbackground{margin-top:0px}
}
@-moz-document url-prefix() {
	.text-level2{margin-top:8px}
}

Reply With Quote
  #2  
Old September 7th, 2012, 12:07 AM
Kravvitz's Avatar
Kravvitz Kravvitz is offline
CSS & JS/DOM Adept
Dev Shed God 30th Plane (19500 - 19999 posts)
 
Join Date: Jul 2004
Location: USA
Posts: 19,831 Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level) 
Time spent in forums: 6 Months 1 Day 19 h 19 m 2 sec
Reputation Power: 4192
I realize your upset, but welcome to DevShed Forums, anyway.

I remember a thread with a similar title recently, but yes, it seems to be missing. I didn't delete it, but maybe one of the other moderators (or administrators) did.

Anyway, the problem is that ".navigation" and "ul#location li" are "positioned" and positioned elements that come later in the document will get stacked on top of those that come before (if they overlap), unless you override that with the z-index property.

Are you aware that your page contains errors? The first step in debugging should always be making sure that your code is valid (in order to rule out any errors as the cause for the problem).
http://validator.w3.org/
http://jigsaw.w3.org/css-validator/
__________________
Spreading knowledge, one newbie at a time. I'm available for hire at Dynamic Site Solutions.

Check out my blog. | Learn CSS. | PHP includes | X/HTML Validator | CSS validator | Common CSS Mistakes | Common JS Mistakes

Remember people spend most of their time on other people's sites (so don't violate web design conventions).

Reply With Quote
  #3  
Old September 7th, 2012, 12:19 AM
AmpWeb AmpWeb is offline
Registered User
Dev Shed Newbie (0 - 499 posts)
 
Join Date: Sep 2012
Posts: 6 AmpWeb User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 59 m 18 sec
Reputation Power: 0
What should I set my z-indexes as?

Reply With Quote
  #4  
Old September 7th, 2012, 03:09 AM
Kravvitz's Avatar
Kravvitz Kravvitz is offline
CSS & JS/DOM Adept
Dev Shed God 30th Plane (19500 - 19999 posts)
 
Join Date: Jul 2004
Location: USA
Posts: 19,831 Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 48th Grade (Above 100000 Reputation Level) 
Time spent in forums: 6 Months 1 Day 19 h 19 m 2 sec
Reputation Power: 4192
You only need to set one. Give the fixed positioned element a z-index that's fairly high but not extremely high, like 4000.

Reply With Quote
  #5  
Old September 7th, 2012, 04:51 AM
AmpWeb AmpWeb is offline
Registered User
Dev Shed Newbie (0 - 499 posts)
 
Join Date: Sep 2012
Posts: 6 AmpWeb User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 59 m 18 sec
Reputation Power: 0
Thank you SOO much. Life saver! (And I'll make sure to validate!)

Reply With Quote
Reply

Viewing: Dev Shed ForumsWeb DesignCSS Help > Content scrolling over/on top of static top nav

Developer Shed Advertisers and Affiliates



Thread Tools  Search this Thread 
Search this Thread:

Advanced Search
Display Modes  Rate This Thread 
Rate This Thread:


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
View Your Warnings | New Posts | Latest News | Latest Threads | Shoutbox
Forum Jump

Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
  
 


Powered by: vBulletin Version 3.0.5
Copyright ©2000 - 2013, Jelsoft Enterprises Ltd.

© 2003-2013 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap