...

View Full Version : Need help with this CSS webpage



gcracker1221
07-10-2008, 08:15 PM
I am editing the Menu on the left of this website.
When i put the menu into the coding it moves the home directories and staff links down and the flas that is inserted overlaps the menu... what do i do?


Index template

<!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"><!-- InstanceBegin template="/Templates/index.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<link href="menu.css" rel="stylesheet" type="text/css" />

<!--
Script to help dumb IE understand :hover on non-anchors. In this case, we're specifically
assigning mouseover events and a new css classname ("over") to li elements of the sidenav ul.
-->
<script language="JavaScript" type="text/javascript"><!--//--><![CDATA[//><!--
startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("sidenav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function() {
this.className=this.className.replace(" over", "");
}
}
}
}
}
window.onload=startList;

//--><!]]></script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<!-- InstanceBeginEditable name="doctitle" -->
<title>Lakeland Economic Development Council</title>
<!-- InstanceEndEditable -->


<!--[if IE]>
<style type="text/css">
#footer { zoom: 1;}
body {word-wrap: break-word;}
#housing_buttons{display:inline;}
#gallery_menu_pic{display:inline;}
#shared_services_buttons{display:inline;}
</style>
<![endif]-->

<!--[if lt IE 7]>
<style type="text/css" media="screen">
#menuh{float:none;}
body{behavior:url(csshover.htc); font-size:100%;}
#menuh ul li{float:left; width: 100%;}
#menuh a{height:1%;font:bold 0.7em/1.4em arial, sans-serif;}
</style>
<![endif]-->
<!-- InstanceBeginEditable name="head" --><!-- InstanceEndEditable -->
<script type="text/JavaScript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>

<link href="CSS/layout.css" rel="stylesheet" type="text/css" media="projection, tv, screen" />
<link href="CSS/news.css" rel="stylesheet" type="text/css" media="projection, tv, screen" />
<link href="CSS/photogallery.css" rel="stylesheet" type="text/css" media="projection, tv, screen" />
<link href="CSS/print.css" rel="stylesheet" type="text/css" media="print, mobile" />
<link href="CSS/menu.css" rel="stylesheet" type="text/css" media="projection, tv, screen" />
</head>

<body onload="MM_preloadImages('file://///ledcsrv02/usershare/ccarter/My Documents/Graham/CSS1/LEDCWebsite/LEDC_Website07/Images/Button_MouseOver_Home.png','file://///ledcsrv02/usershare/ccarter/My Documents/Graham/CSS1/LEDCWebsite/LEDC_Website07/Images/Button_MouseOver_Directions.png','file://///ledcsrv02/usershare/ccarter/My Documents/Graham/CSS1/LEDCWebsite/LEDC_Website07/Images/Button_MouseOver_Staff.png','file://///ledcsrv02/usershare/ccarter/My Documents/Graham/CSS1/LEDCWebsite/LEDC_Website07/Images/Button_MouseOver_ContactUs.png')">
<!--DIV to set Boundary of website-->

<div id="banner">
<!-- DIV Banner that controls the banner/header STARTS here-->
<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0','width','950','height','138','title','flash_header','src','../Flash/header','quality','high','pluginspage','http://www.macromedia.com/go/getflashplayer' ); //end AC code
</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="950" height="138" title="flash_header">
<param name="quality" value="high" /><param name="SRC" value="Flash/header.swf" />
<embed src="Flash/header.swf" width="950" height="138" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"></embed>
</object></noscript>

<!-- END of DIV Banner-->
</div>


<div id="content">
<!-- DIV Content STARTS here-->

<div id="topnavigation">
<!-- DIV topnavigation controls the direction/staff/contact us area STARTS here-->

<a href="contactus.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Contact us','','Images/ButtonMouseOverContactUs.png',1)"><img class="imgnavigation" src="Images/ButtonContactUs.png" alt="LEDC Contact Information" name="Contact us" width="99" height="23" border="0" id="Contact us" /></a>

<a href="staff.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Staff','','Images/ButtonMouseOverStaff.png',1)"><img class="imgnavigation" src="Images/ButtonStaff.png" alt="LEDC Staff" name="Staff" width="69" height="23" border="0" id="Staff" /></a>

<a href="directions.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Directions','','Images/ButtonMouseOverDirections.png',1)"><img class="imgnavigation" src="Images/ButtonDirections.png" alt="Go to Directions Page" name="Directions" width="93" height="23" border="0" id="Directions" /></a>

<a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Home','','Images/ButtonMouseOverHome.png',1)"><img class="imgnavigation" src="Images/ButtonHome.png" alt="Go to Home Page" name="Home" width="69" height="23" border="0" id="Home" /></a> </div>
<!-- END of DIV topnavigation-->

<!-- DIV that controls layout of Sidebar STARTS here-->
<div id="sidebar">

<!-- DIV that is the actual menu STARTS here-->
<!-- begin menu -->
<div id="menu">

<ul class="level1" id="sidenav">

<!-- menu1 -->
<li class="folder">
<a href="">Available Buildings</a>
<ul class="level2">
<li class="explain">Available Buildings</li>

<li><a href="test" class="submenu">Office Space</a></li>
<li><a href="t" class="submenu">Warehouse Space</a></li>
<li><a href="t" class="submenu">Flex Space</a></li>
</ul>
</li>
<!-- menu2 -->

<li class="folder">
<a href="">Real Estate Resources</a>
<ul class="level2">
<li class="explain">Real Estate Resources</li>
<li><a href="t" class="submenu">Land and Building Comps.</a></li>
<li><a href="t" class="submenu">'89-'08 Activity</a></li>
<li><a href="t" class="submenu">Quarterly Market Reports</a></li>
<li><a href="t" class="submenu">Speculative Office</a></li>
</ul>
</li>
<!-- menu3 -->

<li class="folder">
<a href="">Incentives and Taxes</a>
<ul class="level2">
<li class="explain">Incentives and Taxes</li>
<li><a href="t" class="submenu">Incentives</a></li>
<li><a href="t" class="submenu">Taxes</a></li>
</ul>
</li>

</ul>

</div>
<!-- end menu -->

<div id="ylakeland">
<!-- Div Ylakeland STARTS here-->
<a href="http://www.ylakeland.com/" target="_blank">
<img src="Images/ylakeland.jpg" alt="Y Lakeland" name="ylakeland" width="160" height="280"/></a>
<!-- END of DIV Ylakeland-->
</div>

<!-- END of DIV Sidebar-->
</div>

<!-- InstanceBeginEditable name="Body" -->
<div id="page">
<div align="center"><br />

<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0','width','695','height','450','title','Home Flash','src','Flash/CenterFlash','quality','high','pluginspage','http://www.macromedia.com/go/getflashplayer','movie','Flash/CenterFlash' ); //end AC code
</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="695" height="450" title="Home Flash">
<param name="movie" value="Flash/CenterFlash.swf"/>
<param name="quality" value="high" />
<embed src="Flash/CenterFlash.swf" width="695" height="450" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"></embed>
</object></noscript>
</div>
</div>
<!-- InstanceEndEditable -->
<!-- END of DIV Content-->
</div>

<div id="footer">
<!-- DIV footer STARTS here-->
<p class="footer">
210 S. Florida Ave., Ste. 328, Lakeland, FL 33801<br />
Ph: (863) 687-3788 Fax: (863) 688-2941
</p>
<!-- END of DIV Footer-->


<script src="http://www.google-analytics.com/urchin.js" type="text/javascript"></script>
<script type="text/javascript">
_uacct = "UA-3408697-2";
urchinTracker();
</script>
</div>
</body>

<!-- InstanceEnd --></html>


Menu


/* CSS Document */
body {
behavior:url("file:///C|/Documents and Settings/ccarter/Desktop/csshover.htc");
padding: 10px;
}

* {
font: normal Verdana, Arial, Tahoma, Sans-Serif, Helvetica;
}

ul,li {
display: block;
margin: 0;
padding: 0;
border: 0;
}

ul {
width: 150px;
background: #fff;
list-style-type: none;
}

li {
position: relative;
padding: 0px;
z-index: 9;
}

li.folder {
font: normal 11px/16px Verdana, Arial, Tahoma, Sans-Serif, Helvetica;
padding: 2px 0 4px 15px;
background-color: #EFEFEF;
border-top: 1px solid #FFFFFF;
border-bottom: 1px solid #CCCCCC;
}

li.folder:hover {
z-index: 10;
background-color: #EFEFEF;
font: normal 11px/16px Verdana, Arial, Tahoma, Sans-Serif, Helvetica;
}

li.folder ul {
position: absolute;
display: none;
left: 130px; /* IE */
top: 5px;
}

li.folder>ul {
left: 130px;
}

ul.level1 li.folder:hover ul.level2 {
display: block;
width: 200px;
}

a {
padding: 2px;
text-decoration: none;
width: 100%; /* IE */
}

li>a {
width: auto;
}

li a.submenu {
background-color: #EEE;
padding-left: 10px;
font: normal 11px/16px Verdana, Arial, Tahoma, Sans-Serif, Helvetica;
display: block;
border-bottom: 1px solid #FFF;
padding-top: 3px;
padding-bottom: 4px;
}

li.explain {
font: bold 11px Verdana, Arial, Tahoma, Sans-Serif, Helvetica;
background-color: #DCEAF9;
border-bottom: 1px solid #FFFFFF;
color: #6699CC;
padding-left: 10px;
padding-top: 4px;
padding-bottom: 4px;
width: 190px;
}

/* Hide from IE5-mac. Only IE-win sees this. \*/
* html li.explain {
width: 202px;
}
/* End hide from IE5/mac */

a:link, a:visited {
color: #666;
}

a:hover {
color: #000;
}

#menu {
border: 1px solid #ccc;
margin: 0;
padding: 0;
width: 150px;
}

#link {
font: 11px Verdana, Arial, Tahoma, Sans-Serif, Helvetica;
padding: 0px 0px 0px 20px;
margin-top: 15px;



WIll include actual index page in next post

gcracker1221
07-10-2008, 08:16 PM
Index Page itself

<!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"><!-- InstanceBegin template="/Templates/index.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<link href="menu.css" rel="stylesheet" type="text/css" />

<!--
Script to help dumb IE understand :hover on non-anchors. In this case, we're specifically
assigning mouseover events and a new css classname ("over") to li elements of the sidenav ul.
-->
<script language="JavaScript" type="text/javascript"><!--//--><![CDATA[//><!--
startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("sidenav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function() {
this.className=this.className.replace(" over", "");
}
}
}
}
}
window.onload=startList;

//--><!]]></script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<!-- InstanceBeginEditable name="doctitle" -->
<title>Lakeland Economic Development Council</title>
<!-- InstanceEndEditable -->


<!--[if IE]>
<style type="text/css">
#footer { zoom: 1;}
body {word-wrap: break-word;}
#housing_buttons{display:inline;}
#gallery_menu_pic{display:inline;}
#shared_services_buttons{display:inline;}
</style>
<![endif]-->

<!--[if lt IE 7]>
<style type="text/css" media="screen">
#menuh{float:none;}
body{behavior:url(csshover.htc); font-size:100%;}
#menuh ul li{float:left; width: 100%;}
#menuh a{height:1%;font:bold 0.7em/1.4em arial, sans-serif;}
</style>
<![endif]-->
<!-- InstanceBeginEditable name="head" --><!-- InstanceEndEditable -->
<script type="text/JavaScript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>

<link href="CSS/layout.css" rel="stylesheet" type="text/css" media="projection, tv, screen" />
<link href="CSS/news.css" rel="stylesheet" type="text/css" media="projection, tv, screen" />
<link href="CSS/photogallery.css" rel="stylesheet" type="text/css" media="projection, tv, screen" />
<link href="CSS/print.css" rel="stylesheet" type="text/css" media="print, mobile" />
<link href="CSS/menu.css" rel="stylesheet" type="text/css" media="projection, tv, screen" />
</head>

<body onload="MM_preloadImages('file://///ledcsrv02/usershare/ccarter/My Documents/Graham/CSS1/LEDCWebsite/LEDC_Website07/Images/Button_MouseOver_Home.png','file://///ledcsrv02/usershare/ccarter/My Documents/Graham/CSS1/LEDCWebsite/LEDC_Website07/Images/Button_MouseOver_Directions.png','file://///ledcsrv02/usershare/ccarter/My Documents/Graham/CSS1/LEDCWebsite/LEDC_Website07/Images/Button_MouseOver_Staff.png','file://///ledcsrv02/usershare/ccarter/My Documents/Graham/CSS1/LEDCWebsite/LEDC_Website07/Images/Button_MouseOver_ContactUs.png')">
<!--DIV to set Boundary of website-->

<div id="banner">
<!-- DIV Banner that controls the banner/header STARTS here-->
<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0','width','950','height','138','title','flash_header','src','../Flash/header','quality','high','pluginspage','http://www.macromedia.com/go/getflashplayer' ); //end AC code
</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="950" height="138" title="flash_header">
<param name="quality" value="high" /><param name="SRC" value="Flash/header.swf" />
<embed src="Flash/header.swf" width="950" height="138" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"></embed>
</object></noscript>

<!-- END of DIV Banner-->
</div>


<div id="content">
<!-- DIV Content STARTS here-->

<div id="topnavigation">
<!-- DIV topnavigation controls the direction/staff/contact us area STARTS here-->

<a href="contactus.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Contact us','','Images/ButtonMouseOverContactUs.png',1)"><img class="imgnavigation" src="Images/ButtonContactUs.png" alt="LEDC Contact Information" name="Contact us" width="99" height="23" border="0" id="Contact us" /></a>

<a href="staff.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Staff','','Images/ButtonMouseOverStaff.png',1)"><img class="imgnavigation" src="Images/ButtonStaff.png" alt="LEDC Staff" name="Staff" width="69" height="23" border="0" id="Staff" /></a>

<a href="directions.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Directions','','Images/ButtonMouseOverDirections.png',1)"><img class="imgnavigation" src="Images/ButtonDirections.png" alt="Go to Directions Page" name="Directions" width="93" height="23" border="0" id="Directions" /></a>

<a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Home','','Images/ButtonMouseOverHome.png',1)"><img class="imgnavigation" src="Images/ButtonHome.png" alt="Go to Home Page" name="Home" width="69" height="23" border="0" id="Home" /></a> </div>
<!-- END of DIV topnavigation-->

<!-- DIV that controls layout of Sidebar STARTS here-->
<div id="sidebar">

<!-- DIV that is the actual menu STARTS here-->
<!-- begin menu -->
<div id="menu">

<ul class="level1" id="sidenav">

<!-- menu1 -->
<li class="folder">
<a href="">Available Buildings</a>
<ul class="level2">
<li class="explain">Available Buildings</li>

<li><a href="test" class="submenu">Office Space</a></li>
<li><a href="t" class="submenu">Warehouse Space</a></li>
<li><a href="t" class="submenu">Flex Space</a></li>
</ul>
</li>
<!-- menu2 -->

<li class="folder">
<a href="">Real Estate Resources</a>
<ul class="level2">
<li class="explain">Real Estate Resources</li>
<li><a href="t" class="submenu">Land and Building Comps.</a></li>
<li><a href="t" class="submenu">'89-'08 Activity</a></li>
<li><a href="t" class="submenu">Quarterly Market Reports</a></li>
<li><a href="t" class="submenu">Speculative Office</a></li>
</ul>
</li>
<!-- menu3 -->

<li class="folder">
<a href="">Incentives and Taxes</a>
<ul class="level2">
<li class="explain">Incentives and Taxes</li>
<li><a href="t" class="submenu">Incentives</a></li>
<li><a href="t" class="submenu">Taxes</a></li>
</ul>
</li>

</ul>

</div>
<!-- end menu -->

<div id="ylakeland">
<!-- Div Ylakeland STARTS here-->
<a href="http://www.ylakeland.com/" target="_blank">
<img src="Images/ylakeland.jpg" alt="Y Lakeland" name="ylakeland" width="160" height="280"/></a>
<!-- END of DIV Ylakeland-->
</div>

<!-- END of DIV Sidebar-->
</div>

<!-- InstanceBeginEditable name="Body" -->
<div id="page">
<div align="center"><br />

<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0','width','695','height','450','title','Home Flash','src','Flash/CenterFlash','quality','high','pluginspage','http://www.macromedia.com/go/getflashplayer','movie','Flash/CenterFlash' ); //end AC code
</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="695" height="450" title="Home Flash">
<param name="movie" value="Flash/CenterFlash.swf"/>
<param name="quality" value="high" />
<embed src="Flash/CenterFlash.swf" width="695" height="450" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"></embed>
</object></noscript>
</div>
</div>
<!-- InstanceEndEditable -->
<!-- END of DIV Content-->
</div>

<div id="footer">
<!-- DIV footer STARTS here-->
<p class="footer">
210 S. Florida Ave., Ste. 328, Lakeland, FL 33801<br />
Ph: (863) 687-3788 Fax: (863) 688-2941
</p>
<!-- END of DIV Footer-->


<script src="http://www.google-analytics.com/urchin.js" type="text/javascript"></script>
<script type="text/javascript">
_uacct = "UA-3408697-2";
urchinTracker();
</script>
</div>
</body>

<!-- InstanceEnd --></html>



THank you so much for your help!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum