Solved

Hover only works with mouse over text in IE7?

Posted on 2008-06-19
2
435 Views
Last Modified: 2013-12-08
The web page in question is http://www.gmpcpas.com/  -  Safari, FireFox, etc. all look/work fine but IE7 does something I can't figure out how to fix.  In FireFox, when the mouse cursor is placed anywhere over a button on the navigation menu (vertical, left-hand side), the button changes color.  In IE7, the cursor must be over the text portion of the button in order to create this effect.

I didn't create this page, but have been charged with maintaining it.

Here is the CSS for the page:
body { 
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	background-color:#000000
}
 
 
 
 
 
.titleTxt {  font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: #1F6E99}
.paragraphTxt {  font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 18px}
.smallTxt {  font-family: Arial, Helvetica, sans-serif; font-size: 11px}
.defaultTxt {  font-family: Arial, Helvetica, sans-serif; font-size: 12px}
 
 
/*a:active {  color: #1F6E99}*/
/*a:hover {  color: #1F6E99}*/
/*a:link {  color: #1F6E99}*/
/*a:visited {  color: #990099}*/
 
.menuTxt1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #FFFFFF;
	text-decoration: none;
	text-align: right;
	}
	
.menuTxt2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
	color: #FFFFFF;
	text-decoration: none;
	text-align: left;
	}
 
.menuOver {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #000000;
	text-decoration: none;
	display: block;
	padding: 3px;
	border: 1px solid #cccccc;
	border-bottom: 0;
	background: #e6e6e6
	}
 
 
 
 
 
#menu {
	position:absolute;
	left:67px;
	top:116px;
	width:173px;
	height:250px;
	z-index:100
	}
 
#breadcrumbs {
	position:absolute; 
	left:260px; 
	top:130px; 
	width:432px; 
	height:18px; 
	z-index:8
	}
 
 
 
 
 
 
ul {
	margin: 0;
	padding: 0;
	list-style: none;
	width: 173px; /* Width of Menu Items */
	border-bottom: 1px solid #FFFFFF;
	}
 
ul li {
	position: relative;
	}
	
li ul {
	position: absolute;
	left: 172px;
	top: 0;
	display: none;
	}
 
/* Styles for Menu Items */
ul li a {
	display: block;
	text-decoration: none;
	color: #FFFFFF;
	background: #1F6E99; /* IE6 Bug */
	padding: 3px;
	border: 1px solid #FFFFFF;
	border-bottom: 0;
	}
 
/* Fix IE. Hide from IE Mac \*/
* html ul li { float: left; height: 1%; }
* html ul li a { height: 1%; }
/* End */
 
ul li a:hover { 
	color: #FFFFFF; 
	background: #6A98B3
	} /* Hover Styles */
		
li ul li a { 
	padding: 3px; 
	} /* Sub Menu Styles */
		
li:hover ul, li.over ul { 
	display: block;
	} /* The magic */

Open in new window

0
Comment
Question by:moodipaper
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
2 Comments
 
LVL 30

Accepted Solution

by:
Steggs earned 500 total points
ID: 21824414
Hi,

try adding a width to:

ul li a {
        display: block;
        text-decoration: none;
        color: #FFFFFF;
        background: #1F6E99; /* IE6 Bug */
        padding: 3px;
        border: 1px solid #FFFFFF;
        border-bottom: 0;
        }


Steggs
0
 

Author Closing Comment

by:moodipaper
ID: 31468867
My hero!
0

Featured Post

Guide to Performance: Optimization & Monitoring

Nowadays, monitoring is a mixture of tools, systems, and codes—making it a very complex process. And with this complexity, comes variables for failure. Get DZone’s new Guide to Performance to learn how to proactively find these variables and solve them before a disruption occurs.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
cannot view videos at msnbc 12 65
Code Coverage and Coding Standards 2 43
How can I make my tabs look like this? 1 29
Web page design problem 3 12
When it comes to write a Context Sensitive Help (an online help that is obtained from a specific point in state of software to provide help with that state) ,  first we need to make the file that contains all topics, which are given exclusive IDs. …
Because your company can’t afford for you to make SEO mistakes, you’ll want to ensure you’re taking the right steps each and every time you post a new piece of content. This list of optimization do’s and don’ts can help you become an SEO wizard.
Google currently has a new report that is in beta and coming soon to Webmaster Tool accounts. This Micro Tutorial will highlight new features for Google Webmaster Tools.
Shows how to create a shortcut to site-search Experts Exchange using Google in the Chrome browser. This eliminates the need to type out site:experts-exchange.com whenever you want to search the site. Launch the Search Engine Menu: In chrome, via you…

740 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question