No replies
Last seen: 13 years 41 weeks ago
Joined: 2009-08-18
Posts: 1
Points: 0

Hi everyone,

I am having the hardest time controlling where my drop-downs show up! I have gone through the css and made changes but for some reason they don't seem to reflect. Could someone possibly see anything I am missing?

If you hover over the tabs "contact us" and "help desk" on the link below you will see what I mean.

Here is the css for the dropdowns:

	font-weight: bold;
.chromestyle:after{ /*Add margin between menu and rest of content in Firefox*/
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
.chromestyle ul{
	border: 1px solid #BBB;
	width: 800px;
	margin: 0;
	text-align: center;
	padding-top: 16px;
	padding-right: 0;
	padding-bottom: 0px;
	padding-left: 0;
	background-color: #000000;
	height: 32px;
.chromestyle ul li{
	display: inline;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
.chromestyle ul li a{
	color: #FFFFFF;
	margin: 0;
	text-decoration: none;
	padding-right: 8px;
	padding-bottom: 4px;
	padding-left: 8px;
	padding-top: 12px;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #666666;
.chromestyle ul li a:hover, .chromestyle ul li a.selected{ /*script dynamically adds a class of "selected" to the current active menu item*/
/* ######### Style for Drop Down Menu ######### */
	border: 1px solid #BBB; /*THEME CHANGE HERE*/
	border-bottom-width: 0;
	font:normal 12px Verdana;
	background-color: white;
	width: 150px;
	visibility: hidden;
.dropmenudiv a{
width: auto;
display: block;
text-indent: 3px;
border-bottom: 1px solid #BBB; /*THEME CHANGE HERE*/
padding: 2px 0;
text-decoration: none;
font-weight: bold;
color: black;
* html .dropmenudiv a{ /*IE only hack*/
width: 100%;
.dropmenudiv a:hover{ /*THEME CHANGE HERE*/
background-color: #F0F0F0;

Here is the html code for the page:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
<html xmlns="">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link href="index.css" rel="stylesheet" type="text/css" />
<link href="images/chromestyle.css" rel="stylesheet" type="text/css" />
<script language="JavaScript" type="text/javascript" src="chromejs/chrome.js"></script>
<div id="wrap">
<div id="header"></div>
<div id="flash">
  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase=",0,19,0" width="800" height="237" title="SAP Specialists">
    <param name="movie" value="SAP.swf" />
    <param name="quality" value="high" />
    <embed src="SAP.swf" quality="high" pluginspage="" type="application/x-shockwave-flash" width="800" height="237"></embed>
<div id="dropmenu">
<div class="chromestyle" id="chromemenu">
<li><a href="">ABOUT US  </a></li>
<li><a href="#">THE TEAM </a></li>
<li><a href="#">POSITIONS</a></li>
<li><a href="#">QUICK FACTS </a></li>
<li><a href="#">TESTIMONIALS </a></li>	
<li><a href="#">PARTNERS </a></li>	
<li><a href="#" rel="dropmenu1">CONTACT US </a></li>	
<li><a href="#">CASE STUDIES </a></li>	
<li><a href="#" rel="dropmenu2">HELP DESK</a></li>
<!--1st drop down menu -->                                                   
<div id="dropmenu1" class="dropmenudiv">
<a href="">Locations</a>
<a href="">Register</a></div>
<!--2nd drop down menu -->                                                
<div id="dropmenu2" class="dropmenudiv" style="width: 150px;">
<a href="">Collateral</a></div>
<!--3rd drop down menu -->
<script type="text/javascript">
<div id="main"></div>
<div id="rr"><img src="images/RR-teaser.png" width="255" height="168" /></div>
<div id="testimonials"><img src="images/Testimonials-bknd.png" width="258" height="168" /></div>
<div id="dod"><img src="images/DoD-teaser.png" width="255" height="168" /></div>
<div id="footer">Copyright 
  2009 Kr&ouml; &nbsp;I &nbsp;Contact Webmaster</div>

Any help would be greatly appreciated!!!!